All the Styles

May 13, 1900

What will your content look like? See the styles below!

Headings

Start a section with one of these beauties. Use ## to quickly create a second-level heading (h2). h1 is reserved for the title.

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Text

Here's a sample paragraph from The War of the Worlds by H. G. Wells. Read the book. Smart uses Work Sans for body text and Archivo for headings, all loaded locally.

No one would have believed in the last years of the nineteenth century that this world was being watched keenly and closely by intelligences greater than man’s and yet as mortal as his own; that as men busied themselves about their various concerns they were scrutinized and studied, perhaps almost as narrowly as a man with a microscope might scrutinize the transient creatures that swarm and multiply in a drop of water. With infinite complacency men went to and fro over this globe about their little affairs, serene in their assurance of their empire over matter. It is possible that the infusoria under the microscope do the same. No one gave a thought to the older worlds of space as sources of human danger, or thought of them only to dismiss the idea of life upon them as impossible or improbable. It is curious to recall some of the mental habits of those departed days. At most terrestrial men fancied there might be other men upon Mars, perhaps inferior to themselves and ready to welcome a missionary enterprise. Yet across the gulf of space, minds that are to our minds as ours are to those of the beasts that perish, intellects vast and cool and unsympathetic, regarded this earth with envious eyes, and slowly and surely drew their plans against us. And early in the twentieth century came the great disillusionment.

Typography samples

The quick, bold, brown fox jumps over the lazy dog.

The quick, italic, brown fox jumps over the lazy dog.

The quick, italic, bold, brown fox jumps over the lazy dog.

The quick coding, brown fox jumps over the lazy dog

Blockquote 1

— Frank Lloyd Wright

Blockquote 2

There are two styles of blockquote available that can by cycled through by repeatedly pressing the blockquote toolbar icon.

Callout

🤩

Draw attention to something with a callout

Table & Lists

Bear Type	Diet	Geography	Color	Best
Brown	Salmon	Forest	Brown	✖️
Black	Berries	Forest	Black	✖️
Koala	Eucalyptus	Forest	Gray	✅

Ordered List

List Item
List Item
List Item

Unordered List

List Item
List Item
List Item

ADD A BUTTON

Toggle header

Product card

Product description

Buy me, bro

This is really important

No, really

But, really

Media

Mountains and beautiful sky — Standard Image

Embeds

Code

<!doctype html>
<html class="no-js" lang="">

<head>
  <meta charset="utf-8">
  <title></title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <meta property="og:title" content="">
  <meta property="og:type" content="">
  <meta property="og:url" content="">
  <meta property="og:image" content="">

  <link rel="manifest" href="site.webmanifest">
  <link rel="apple-touch-icon" href="icon.png">
  <!-- Place favicon.ico in the root directory -->

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

  <meta name="theme-color" content="#fafafa">
</head>