Displays a block of text and can contain inline elements such as buttons, links, or emphasized text. Use to present standalone blocks of content as opposed to inline text.

Useful for

• Displaying text content in a paragraph format.
• Grouping elements with the same style. For instance, icons inside a paragraph will automatically adopt the paragraph's tone.

Best practices

• Use short paragraphs to make your content scannable.
• Use plain and clear terms.
• Don't use jargon or technical language.
• Don't use different terms to describe the same thing.
• Don't duplicate content.

Example

  <.s_paragraph>
    Shopify POS is the easiest way to sell your products in person. Available for
    iPad, iPhone, and Android.
  </.s_paragraph>

## See

• http://shopify.dev/docs/api/app-home/polaris-web-components/titles-and-text/paragraph

Attributes

• accessibility_visibility (:string) - Changes the visibility of the element.

  • visible: the element is visible to all users.
  • hidden: the element is removed from the accessibility tree but remains visible.
  • exclusive: the element is visually hidden but remains in the accessibility tree.

• color (:string) - Modify the color to be more or less intense.

• dir (:string) - "" | "auto" | "ltr" | "rtl"

  Indicates the directionality of the element’s text.

  • ltr: languages written from left to right (e.g. English)
  • rtl: languages written from right to left (e.g. Arabic)
  • auto: the user agent determines the direction based on the content
  • '': direction is inherited from parent elements (equivalent to not setting the attribute)

• font_variant_numeric (:string)

• line_clamp (:string) - Truncates the text content to the specified number of lines.

• tone (:string) - Sets the tone of the component, based on the intention of the information being conveyed.

• Global attributes are accepted.

Slots

• inner_block