Paragraph
Normal paragraph tags are smaller. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus ipsam aperiam laborum quidem deserunt nulla ea maxime inventore necessitatibus eaque dolor adipisci, quaerat incidunt laboriosam, deleniti placeat odio! Libero, non.
This is a description paragraph.
This is an introductory paragraph. All that is required to use this element is a cheeky .lede or .lead tag on the paragraph element of your choosing. Fun fact: This class name is nicked from inuit.css and originates from journalism and its use of the lead parahgraph. The "lede" spelling was created to differentiate it from leading, the distance between the baselines.
If we would like small body copy, there's a plethora of options available to us. You can apply the mini class to your paragraphs or their container.
Here's some even smaller text. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci ipsa quisquam eveniet temporibus ipsum accusamus odit in enim nobis sint voluptate sed minus nostrum dignissimos sit, id nisi, aut. Sed? Facere necessitatibus maxime quod ex, minima ea corporis. Nisi ipsa qui ex sint voluptas voluptatibus iure, nam, obcaecati vero voluptates nesciunt repudiandae consectetur beatae vitae culpa, facilis distinctio excepturi. Adipisci. Vero aspernatur eum explicabo eius perferendis distinctio inventore commodi aliquid, veniam sint minus ratione, consectetur, amet hic. Necessitatibus veritatis exercitationem neque provident possimus minima, odio debitis itaque autem, repellendus ex.
Usage notes
For legibility and flexibility, the standard font for all non-heading typography is 'Open Sans'.
It has a neutral, yet friendly appearance and is optimized for print, web, and mobile interfaces, and has excellent legibility characteristics.
Try not to introduce any new font or font weights to the design as it will add more complexity to the page. If there is a difficult design challenge, try using scale and proximity.
<p>Normal paragraph tags are smaller. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus ipsam aperiam laborum quidem deserunt nulla ea maxime inventore necessitatibus eaque dolor adipisci, quaerat incidunt laboriosam, deleniti placeat odio!
Libero, non.</p>
<p class="description">This is a description paragraph.</p>
<p class="lede">This is an introductory paragraph. All that is required to use this element is a cheeky <code>.lede</code> or <code>.lead</code> tag on the paragraph element of your choosing. Fun fact: This class name is nicked from inuit.css and originates from journalism
and its use of the lead parahgraph. The "lede" spelling was created to differentiate it from
<em>lead</em>ing, the distance between the baselines.</p>
<p class="mini">If we would like small body copy, there's a plethora of options available to us. You can apply the <code>mini</code> class to your paragraphs or their container.</p>
<p class="micro">Here's some even smaller text. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci ipsa quisquam eveniet temporibus ipsum accusamus odit in enim nobis sint voluptate sed minus nostrum dignissimos sit, id nisi, aut. Sed? Facere necessitatibus
maxime quod ex, minima ea corporis. Nisi ipsa qui ex sint voluptas voluptatibus iure, nam, obcaecati vero voluptates nesciunt repudiandae consectetur beatae vitae culpa, facilis distinctio excepturi. Adipisci. Vero aspernatur eum explicabo eius perferendis
distinctio inventore commodi aliquid, veniam sint minus ratione, consectetur, amet hic. Necessitatibus veritatis exercitationem neque provident possimus minima, odio debitis itaque autem, repellendus ex.</p>