This page is inspired and based of off Binyamin's style guide, which took inspiration from Brian Devries's style guide.

Block-level elements


Cillum laboris ex proident et in exercitation eu aliqua cillum magna non. Veniam incididunt id tempor qui cillum laborum reprehenderit esse nisi excepteur velit. Mollit proident consectetur ea adipisicing fugiat cillum nostrud officia ullamco officia amet fugiat. Fugiat excepteur ullamco nulla reprehenderit ipsum do sit laboris.



Officia consectetur in labore deserunt qui laborum.


Officia consectetur in labore deserunt qui laborum.


Officia consectetur in labore deserunt qui laborum.

Officia consectetur in labore deserunt qui laborum.

Cillum exercitation magna eiusmod laborum mollit excepteur irure officia laboris enim laborum in quis. Et irure elit est veniam occaecat culpa. Do commodo consectetur sit nisi ex laboris aute ex fugiat eiusmod velit labore. Nisi minim non dolore et consectetur id. Do nulla tempor magna qui quis ullamco nostrud duis officia laboris est sunt. Veniam consectetur proident dolor excepteur ullamco qui proident exercitation mollit sit.


  1. A numbered list

Code blocks

  P R E F O R M A T T E D T E X T
  ! " # $ % & ' ( ) * + , - . /
  0 1 2 3 4 5 6 7 8 9 : ; < = > ?
  @ A B C D E F G H I J K L M N O
  P Q R S T U V W X Y Z [ \ ] ^ _
  ` a b c d e f g h i j k l m n o
  p q r s t u v w x y z { | } ~ 
npm install prettier -D
html {
  scroll-behavior: smooth;
print("Hello World!") 
def sum(a, b):
  return a + b
console.log('Hello World!'); 
function sum(a, b) {
  return a + b; 
<!DOCTYPE html>
<html lang="en">
  	<meta charset="utf-8" />
  	<meta name="description" content="" />
  	<meta name="viewport" content="width=device-width, initial-scale=1" />

  	<link rel="icon" href="/favicon.ico" sizes="any" />
  	<link rel="icon" href="/icon.svg" type="image/svg+xml" />

  	<link rel="stylesheet" href="css/style.css" />

Horizontal rules




Placeholder/example image

Inline elements

  1. This is a footnote. ↩︎