Style Page

All the styles, in one place

Headings

All HTML headings, <h1> through <h6>, are available.

Heading 2 example

Heading 3 example

Heading 4 example

Heading 5 example
Heading 6 example

List Types

Ordered List

An unordered list starts with the <ol> tag. Each list item starts with the <li> tag. The list items will be marked with numbers by default:

  1. List Item 1
  2. List Item 2
  3. List Item 3

Unordered List

An unordered list starts with the <ul> tag. Each list item starts with the <li> tag. The list items will be marked with bullets by default:

  • List Item a
  • List Item b
  • List Item c

Blockquotes

For quoting blocks of content from another source within your document.
Single line blockquote:

Stay hungry. Stay foolish.

Multi line blockquote:

In the last year, we learned that the technical infrastructure exists now for even non-technical journalists to build a sustainable site that can receive money from subscribers. That may sound obvious on the surface, but when you run a site for investigations, and multiple podcast feeds, and send different types of newsletters to different segments of your audience throughout the week, there are several moving parts you and the tools you buy need to link together. If you are a journalist reading this thinking about going out on their own: the tech is there for you to do so with very little know-how needed, and we are happy to talk you through any questions you might have. - 404 Media

Blockquote with paragraph breaks

In the last year, we learned that the technical infrastructure exists now for even non-technical journalists to build a sustainable site that can receive money from subscribers.
That may sound obvious on the surface, but when you run a site for investigations, and multiple podcast feeds, and send different types of newsletters to different segments of your audience throughout the week, there are several moving parts you and the tools you buy need to link together.
If you are a journalist reading this thinking about going out on their own: the tech is there for you to do so with very little know-how needed, and we are happy to talk you through any questions you might have.

Blockquote with breaks made with Markdown

In the last year, we learned that the technical infrastructure exists now for even non-technical journalists to build a sustainable site that can receive money from subscribers.
That may sound obvious on the surface, but when you run a site for investigations, and multiple podcast feeds, and send different types of newsletters to different segments of your audience throughout the week, there are several moving parts you and the tools you buy need to link together.
If you are a journalist reading this thinking about going out on their own: the tech is there for you to do so with very little know-how needed, and we are happy to talk you through any questions you might have.

Alternative blockquote style (Secret editor feature, hit the Blockquote button twice!):

Success is not final, failure is not fatal: it is the courage to continue that counts.

Section line:


Buttons


Bookmark cards

Outpost
Outpost is a member-services co-op that supercharges Ghost-powered newsletters and publications with smart tech.

Callout cards

⚠️
Highlight some important information with callout cards
Highlight some important information with callout cards
✔️
Highlight some important information with callout cards
ℹ️
Highlight some important information with callout cards

Toggle cards

Want some collapsible content?

You can use toggle cards to add collapsible content, which for example can be used for an FAQ section


Video cards (video uploaded to Ghost)

0:00
/0:14

Share your videos


Audio cards (audio hosted by Ghost)

audio-thumbnail
Abstract music
0:00
/88.032625
audio-thumbnail
The epic trailer
0:00
/92.0555

File cards


Product cards

Premium Ghost Themes

Check out the best Ghost Themes for your blog, newsletter, or portfolio.

Explore Themes

Header cards

Eye-catching CTA

Use header cards to add a bold, eye-catching CTA with different styles and sizes.

Become a member

Eye-catching CTA

Use header cards to add a bold, eye-catching CTA with a background image.

Become a member

Images

Normal image
Wide image
Full width image

Embeds

Youtube

Vimeo

Twitter

Text-level semantics

Styling for common inline HTML5 elements.

The a element example.
The abbr element and abbr element with title examples
The b element example
The cite element example
The code element example
The del element example
The dfn element and dfn element with title examples
The em element example
The i element example
The ins element example
The kbd element example
The mark element example
The q element inside a q element example
The s element example
The samp element example
The small element example
The span element example
The strong element example
The sub element example
The sup element example
The var element example
The u element example
The <details> element:

Details Summary

Details content. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.


Tables

# Table_Header_1 Table_Header_2 Table_Header_3 Table_Header_4 Table_Header_5 Table_Header_6 Table_Header_7 Table_Header_8
1 Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8
2 Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8
3 Division 1 Division 2 Division 3 Division 4 Division 5 Division 6 Division 7 Division 8
# Table_Header_1 Table_Header_2 Table_Header_3
1 Division 1 Division 2 Division 3
2 Division 1 Division 2 Division 3
3 Division 1 Division 2 Division 3

Comments

Only paid subscribers can comment.
Please subscribe or sign in to join the conversation.