#Paragraph

#Import

import { P } from '@dnb/eufemia/elements'

#Description

Paragraphs are a block-level elements, used to structure and format text contents.

#Paragraph class modifiers

Eufemia comes with several styles you can use on paragraphs and other HTML text elements:

Weights

• .dnb-p (Body text)
• .dnb-p--medium

Sizes

• .dnb-p--small
• .dnb-p--x-small

Variants

• .dnb-p--lead

Read more about Fonts in the Designer Guides.

#Demos

#Paragraphs modifiers

<div>
  <P>Default paragraph</P>
  <P modifier="medium">Medium weight paragraph</P>
  <P size="small">Small paragraph</P>
  <P modifier="small medium">Small paragraph with medium weight</P>
  {/* (Bold is currently not supported by DNB UX) */}
  {/* <P modifier="bold">Bold weight paragraph</P> */}
  {/* <P modifier="small bold">Small paragraph with bold weight</P> */}
</div>

#Paragraphs basis sized

#Paragraph small sized

#Additional Paragraph formatting (not defined yet)