Design Component Library


Typography

Aa

400

400 link

400 Italic

500

500 link

500 Italic

600

600 link

600 Italic

Libre Franklin

400

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

400 ITALIC

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

500 REGULAR

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

500 ITALIC

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

600 REGULAR

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

600 ITALIC

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

Display X-Large

H1

H2

H3

H4

H5

X Large Text

Large Text

Paragraph Text

Small Text


Lists

Ordered List

  1. Floor Plan Software: Consider using digital floor plan tools to visualize and manipulate seating arrangements, helping to optimize venue capacity effectively. A quick smartphone search in the Apple Store or Google Play should bring up numerous apps. Some of these feature augmented reality to help with visualization.
  2. Item 2
  3. Item 3

Unordered List

  • Floor Plan Software: Consider using digital floor plan tools to visualize and manipulate seating arrangements, helping to optimize venue capacity effectively. A quick smartphone search in the Apple Store or Google Play should bring up numerous apps. Some of these feature augmented reality to help with visualization.
  • Item 2
  • Item 3

Buttons

Main Buttons

Primary Buttons - Main CTA's, Positive actions

Secondary Buttons

Tertiary Buttons

Text Links

Sentence with a Text Link

Neutral Buttons

Primary Neutral Buttons

Secondary Neutral Buttons

Tertiary Neutral Buttons

White Buttons (for use on dark backgrounds)

Primary White Buttons

Secondary Neutral Buttons

Tertiary White Buttons

White Text Links

Sentence with a Text Link



Form Elements

Checkboxes


  • Badges

    In-stock colors!

    In-stock colors!

    CATEGORY


    Chips

    • Grade A
    • Grade B ($)
    • Grade C ($$)
    • Grade D ($$$)
    • Grade E ($$$$)
    • Grade F ($$$$$)
    • Grade G ($$$$$$)

    Hot Spots


    Input Fields

    Please complete this required field.
    Please complete this required field.
    Please complete this required field.
    Please complete this required field.
    Please complete this required field.

    Pagination



    Tool Tips

    Tooltip

    Tooltip with Header

    Tiny Tooltip