Typography

Florida State University's brand fonts are Adobe Garamond (serif) and Acumin Pro (sans-serif) with fallbacks to Times New Roman and Arial.

Adobe Fonts

Acumin Pro is available for use on fsu.edu domains with the following code within the <head> of your HTML.

<link href="https://use.typekit.net/qwg1fji.css" rel="stylesheet" type="text/css" />

Headers

Standard

Header 1 Small

Header 2 Small

Header 3 Small

Header 4 Small

Header 5 Small
Header 6 Small

Linked

Header 1 Small

Header 2 Small

Header 3 Small

Header 4 Small

Header 5 Small
Header 6 Small

You may apply classes .h1-.h6 to give the appearance of <h1>-<h6> elements.

Lead Paragraphs

Luptatum in roto minim damnum humo transverbero transverbero quibus. Rusticus indoles premo. Delenit qui damnum distineo defui tation mauris scisco si qui. Nulla erat duis secundum.

Assign the class of .lead to your paragraph or container to apply the effect.

Standard Paragraphs and Inline Styles

Luptatum in roto minim damnum humo transverbero transverbero quibus. Rusticus indoles premo. Delenit qui damnum distineo defui tation mauris scisco si qui. Nulla erat duis secundum.

Eum ratis sagaciter nisl ymo refero sed. Fere adsum aliquam dolus interdico. Comis hendrerit inhibeo illum nobis verto. Saluto quibus os loquor nullus erat qui loquor sagaciter bene. Antehabeo reprobo ullamcorper iaceo wisi typicus damnum ea. Jus demoveo ea suscipit magna tristique dolore delenit molior.

Patria in antehabeo. Quod quidem fatua laoreet gravis consequat zelus veniam olim usitas tego velit. Appellatio tation vulputate iustum augue. Vindico eu usitas nunc neo nulla populus quia saluto minim.

Style Code Example
Bold <b> <strong> Quidne tation opes opto.
Italics <i> <em> Feugait persto epulae eum.
Small <small> .small Iusto illum velit ut nullus ulciscor inhibeo suscipit.
Marked <mark> Duis plaga molior utrum fatua dolore.
Deleted <del> Melior esse nulla suscipit caecus.
Strikethrough <s> Macto scisco ad nisl voco.
Inserted <ins> Letatio blandit facilisis.
Underlined <u> Aliquam minim consectetuer quidem.
Left .text-left Aliquam minim consectetuer quidem.
Centered .text-center

Aliquam minim consectetuer quidem.
Right .text-right

Aliquam minim consectetuer quidem.
Justified .text-justify

Saluto sit lucidus epulae vel ex ideo. Et ut demoveo abigo duis dolore. Lenis iusto vero nostrud vindico epulae in consequat. Ut gravis feugiat consequat quod consequat plaga. Aptent imputo roto duis paratus iaceo huic tation dolor.
No Wrap .text-nowrap

Velit diam ille premo quia regula hendrerit vel.
Lowercase .text-lowercase

USITAS LUCTUS QUIDEM TE AD IDEO ESCA SED EXPUTO TAMEN
Uppercase .text-uppercase

nutus lobortis nullus humo ex adsum minim
Capitalize .text-capitalize

mauris ad turpis ille nunc suscipit gemino virtus ingenium vulpes tego
Abbreviation <abbr>

An abbreviation of the word attribute is attr
Initialism abbr.initialism HTML is the best thing since sliced bread.

Quotes

Eum ratis sagaciter nisl ymo refero sed. Fere adsum aliquam dolus interdico. Comis hendrerit inhibeo illum nobis verto. Saluto quibus os loquor nullus erat qui loquor sagaciter bene. Antehabeo reprobo ullamcorper iaceo wisi typicus damnum ea. Jus demoveo ea suscipit magna tristique dolore delenit molior.

Luptatum in roto minim damnum humo transverbero transverbero quibus. Rusticus indoles premo. Delenit qui damnum distineo defui tation mauris scisco si qui. Nulla erat duis secundum.

Integer euismod lacus luctus magna.

Eum ratis sagaciter nisl ymo refero sed. Fere adsum aliquam dolus interdico. Comis hendrerit inhibeo illum nobis verto. Saluto quibus os loquor nullus erat qui loquor sagaciter bene. Antehabeo reprobo ullamcorper iaceo wisi typicus damnum ea. Jus demoveo ea suscipit magna tristique dolore delenit molior.

Luptatum in roto minim damnum humo transverbero transverbero quibus. Rusticus indoles premo. Delenit qui damnum distineo defui tation mauris scisco si qui. Nulla erat duis secundum.

Integer euismod lacus luctus magna.

Eum ratis sagaciter nisl ymo refero sed. Fere adsum aliquam dolus interdico. Comis hendrerit inhibeo illum nobis verto. Saluto quibus os loquor nullus erat qui loquor sagaciter bene. Antehabeo reprobo ullamcorper iaceo wisi typicus damnum ea. Jus demoveo ea suscipit magna tristique dolore delenit molior.

Luptatum in roto minim damnum humo transverbero transverbero quibus. Rusticus indoles premo. Delenit qui damnum distineo defui tation mauris scisco si qui. Nulla erat duis secundum. Luptatum in roto minim damnum humo transverbero transverbero quibus. Rusticus indoles premo. Delenit qui damnum distineo defui tation mauris scisco si qui. Nulla erat duis secundum.

Eum ratis sagaciter nisl ymo refero sed. Fere adsum aliquam dolus interdico. Comis hendrerit inhibeo illum nobis verto. Saluto quibus os loquor nullus erat qui loquor sagaciter bene. Antehabeo reprobo ullamcorper iaceo wisi typicus damnum ea. Jus demoveo ea suscipit magna tristique dolore delenit molior.

Use .left or .right to float <blockquote> in the small through large breakpoints. Quotes are half of the content width on the small display while medium and large displays are set to one third. Use .lead and .inline to adjust the size of the blockquote.

Lists

Unordered

Ordered

  1. Lorem ipsum dolor sit amet
  2. Consectetur adipiscing elit
  3. Nulla volutpat aliquam velit
    • Phasellus iaculis neque
    • Purus sodales ultricies
    • Vestibulum laoreet porttitor sem
  4. Faucibus porta lacus fringilla vel
  5. Aenean sit amet erat nunc

Unstyled

  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Nulla volutpat aliquam velit
    • Phasellus iaculis neque
    • Purus sodales ultricies
    • Vestibulum laoreet porttitor sem
  • Faucibus porta lacus fringilla vel
  • Aenean sit amet erat nunc

Inline

  • Lorem ipsum
  • Phasellus iaculis
  • Nulla volutpat

Definition

Description lists
A description list is perfect for defining terms.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.

Definition (Horizontal)

The horizontal description list appears the same as the normal description list in mobile view.