Senya Style Guide

Typography

Substandard

Heading 1 / 3.15rem - 3.67rem - 30px

Substandard

Heading 2 / 3.15rem - 3.67rem - 30px

Substandard

Heading 3 / 2.36rem - 2.75rem - 22px

Substandard

Heading 4 / 1.77rem - 2.06rem - 17px
Substandard
Heading 5 / 1.33rem - 1.55rem - 12px
Substandard
Heading 6 / 3.15rem - 3.67rem - 30px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

XLarge Standard Paragraph / 2rem - 2.33rem - 18px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Standard Paragraph / 1.5rem - 1.75rem - 14px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Small Standard Paragraph / 1.2rem - 1.4rem - 12px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

XSmall Standard Paragraph / 1rem - 1.2rem - 10px
This is Functional Text
Function Text / 1.1rem - 1.28rem - 11px

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat."

Pull Quote / 2rem - 2.33rem - 18px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Large Quote / 3.15rem - 3.67rem - 30px
Rich Text

Rich Heading 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Rich Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Rich Heading 3

  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Suspendisse varius enim in eros elementum tristique.
  • Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Rich Heading 4

  1. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  2. Suspendisse varius enim in eros elementum tristique.
  3. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.
Rich Heading 5
Drift BMW, default Style Guide page image
Drift BMW - Image Caption / .8 rem - .96rem - 10px
Rich Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Rich Text Paragraph / 1rem - 1.2rem - 12px
Standard Images
Drift BMW, default Style Guide page image
Standard Cards

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Standard Buttons - UI / 1.2rem - 1.4rem - 14px
Color
#1569ff
#e7f0ff
#ef382d
#fdebea
#222222
#555555
#888888
#fafafa
Margin / Padding Scale factor @max-width 767px Breakpoint
8/2 = 6/1.5 = 4/1
2/1 = 1/0.5 = 0.8/0.4 = 0.5/0.25 = 0.4/0.2 = 0.2/0.1
Forms

Thanks for reaching out! One of our experts will get back to you soon.

Oops! Something went wrong...

Download Pop-up Modal

Signup