Paragraph

Displays blocks of text for content sections with options for alignment, size and decoration.

This is a paragraph with bold, italic and link text.

_bookshop_name: primitives/paragraph
text: This is a paragraph with **bold**, *italic* and [link](https://example.com/) text.
align: start
size: md

Properties

text string

The text content of the paragraph.

align enum | default: start

The alignment of the text.

Accepted values:
  • start
  • center
  • end

size enum | default: md

The font size of the text.

Accepted values:
  • xs
  • sm
  • md
  • lg
  • xl
  • 2xl
  • 3xl
  • 4xl
  • 5xl
  • 6xl

Examples

Align

Start aligned

Center aligned

End aligned

- _bookshop_name: primitives/paragraph
  text: '**Start** aligned'
  align: start
  size: md
- _bookshop_name: primitives/paragraph
  text: '**Center** aligned'
  align: center
  size: md
- _bookshop_name: primitives/paragraph
  text: '**End** aligned'
  align: end
  size: md

Sizes

This is a xs paragraph

This is a sm paragraph

This is a md paragraph

This is a lg paragraph

This is a xl paragraph

This is a 2xl paragraph

This is a 3xl paragraph

This is a 4xl paragraph

This is a 5xl paragraph

This is a 6xl paragraph

- _bookshop_name: primitives/paragraph
  text: This is a xs paragraph
  align: start
  size: xs
  decoration: none
- _bookshop_name: primitives/paragraph
  text: This is a sm paragraph
  align: start
  size: sm
  decoration: none
- _bookshop_name: primitives/paragraph
  text: This is a md paragraph
  align: start
  size: md
  decoration: none
- _bookshop_name: primitives/paragraph
  text: This is a lg paragraph
  align: start
  size: lg
  decoration: none
- _bookshop_name: primitives/paragraph
  text: This is a xl paragraph
  align: start
  size: xl
  decoration: none
- _bookshop_name: primitives/paragraph
  text: This is a 2xl paragraph
  align: start
  size: 2xl
  decoration: none
- _bookshop_name: primitives/paragraph
  text: This is a 3xl paragraph
  align: start
  size: 3xl
  decoration: none
- _bookshop_name: primitives/paragraph
  text: This is a 4xl paragraph
  align: start
  size: 4xl
  decoration: none
- _bookshop_name: primitives/paragraph
  text: This is a 5xl paragraph
  align: start
  size: 5xl
  decoration: none
- _bookshop_name: primitives/paragraph
  text: This is a 6xl paragraph
  align: start
  size: 6xl
  decoration: none