> ## Content Index
> Fetch the complete content index at: https://hamptons.themesbykyle.com/llms.txt
> Use this file to discover other available public pages before exploring further.

# Style Guide
- URL: https://hamptons.themesbykyle.com/style-guide/
- Published: 2026-07-29T09:51:39.000Z
- Updated: 2026-09-27T09:51:39.000Z
- Description: Every type of content card in one place: images, galleries, quotes, callouts, toggles, buttons and bookmarks, as they appear in Hamptons.
- Author: Eleanor Voss
- Tags: #hamptons-demo

Hamptons is designed for long-form editorial writing, but a good story rarely lives on text alone. This page gathers every type of content card in one place, so you can see how each is styled before you begin publishing. It is also a useful reference when deciding which card best suits a particular moment in a story.

Body text is set in a generous serif with comfortable line spacing. Writers can use **bold**, *italic* and [inline links](https://hamptons.themesbykyle.com/about/), which pick up a quiet underline in the accent colour.

## Headings and lists

Second-level headings divide a story into chapters. Third-level headings work well for shorter asides within a section.

### A smaller subheading

- Travertine, lime plaster and unlacquered brass
- Oak boards laid in random widths
- Linen, wool and undyed cotton
1. Choose a restrained palette.
2. Let one material lead.
3. Allow surfaces to age.

## Images

Images can sit within the text column, extend wider than it, or run the full width of the screen. Each supports an optional caption.

![A layered townhouse drawing room](https://hamptons.themesbykyle.com/content/files/images/hamptons-demo/06-rooms-in-conversation.jpg)

A standard image sits within the text column.

![A curved plaster pavilion beside a pool](https://hamptons.themesbykyle.com/content/files/images/hamptons-demo/11-soft-geometry.jpg)

A wide image breaks out of the text column for greater impact.

Full-width images are best saved for a single decisive moment in a story, such as the first view of a house or a change of setting.

![A stone path through a coastal English garden](https://hamptons.themesbykyle.com/content/files/images/hamptons-demo/03-new-english-garden.jpg)

A full-width image runs edge to edge.

## Galleries

Galleries arrange several images into neat rows. They suit a sequence of rooms, a collection of objects or a walk through a place.

![A travertine living room](https://hamptons.themesbykyle.com/content/files/images/hamptons-demo/02-quiet-stone.jpg)

![A working country kitchen](https://hamptons.themesbykyle.com/content/files/images/hamptons-demo/08-collectors-kitchen.jpg)

![A stoneware pitcher and linen](https://hamptons.themesbykyle.com/content/files/images/hamptons-demo/05-objects-of-permanence.jpg)

![A walnut commode](https://hamptons.themesbykyle.com/content/files/images/hamptons-demo/10-case-for-brown-furniture.jpg)

![A ceramicist at work](https://hamptons.themesbykyle.com/content/files/images/hamptons-demo/12-home-with-ceramicist.jpg)

A gallery of five images across two rows.

## Quotes

> A standard quote is set in italic with a fine rule in the accent colour. It suits a line worth pausing on.

> The alternative quote style is larger and centred, for the one line a reader should remember.

## Callouts, toggles and buttons

🏛️

A callout highlights practical information, such as opening hours, a designer’s credits or a note on where to buy.

#### What is a toggle card for?

Toggles keep supplementary detail out of the way until a reader wants it: sources, a list of suppliers or answers to common questions.

[About the magazine](https://hamptons.themesbykyle.com/about/)

## Bookmarks and dividers

A bookmark card turns a link into a preview, which is useful for pointing readers to further reading.

[Shingle style architectureAn American architectural style made popular by the rise of the New England school of architecture, which eschewed the highly ornamented patterns of the Eastlake style.![](https://en.wikipedia.org/static/apple-touch/wikipedia.png)Wikipedia](https://en.wikipedia.org/wiki/Shingle%5Fstyle%5Farchitecture?ref=hamptons.themesbykyle.com)

A divider marks a change of scene or a pause in the narrative.

---

That completes the tour. Everything above is written in Ghost’s editor with no custom code, and adapts from phone to wide desktop screens.