Style Guide

Topography

h1

h2

h3

h4

paragraph

strong

SourceSans3

  • !!! Missing font-[100]
  • !!! Missing font-[100] Italic
  • font-[200]
  • font-[200] Italic
  • font-[300]
  • font-[300] Italic
  • font-[400]
  • font-[400] Italic
  • font-[500]
  • font-[500] Italic
  • font-[600]
  • font-[600] Italic
  • font-[700]
  • font-[700] Italic
  • !!! Missing font-[800]
  • !!! Missing font-[800] Italic
  • font-[900]
  • font-[900] Italic

SourceSerifPro

  • !!! Missing font-[100]
  • !!! Missing font-[100] Italic
  • font-[200]
  • font-[200] Italic
  • font-[300]
  • font-[300] Italic
  • font-[400]
  • font-[400] Italic
  • font-[500]
  • font-[500] Italic
  • font-[600]
  • font-[600] Italic
  • font-[700]
  • font-[700] Italic
  • !!! Missing font-[800]
  • !!! Missing font-[800] Italic
  • font-[900]
  • font-[900] Italic

Icons

Buttons

Button Types

Link button Link button

Button Styles

btn-primary

btn-primary btn-outline

btn-secondary

btn-secondary btn-outline

btn-tertiary

btn-tertiary btn-outline

btn-tertiary-white

btn danger

List

  • Minim proident velit nulla duis id velit aute. Fugiat proident deserunt commodo voluptate ipsum reprehenderit enim nisi ex ad reprehenderit. Irure aute dolor consequat quis in veniam tempor esse reprehenderit quis ea reprehenderit. Pariatur proident reprehenderit laboris ex nulla proident anim sint ullamco proident laborum tempor ut. Proident tempor fugiat eu sint tempor mollit irure officia occaecat proident qui nulla duis.
  • Minim est incididunt ex mollit nostrud deserunt labore aute proident. In velit voluptate dolore mollit dolore sit culpa ex magna. Commodo adipisicing consequat duis eu dolor et voluptate elit veniam. Proident do nisi et esse nostrud enim eu enim aute pariatur non consequat aliqua. Nulla nulla ullamco mollit deserunt officia.
  • Consequat ea quis ullamco Lorem ea labore laborum tempor anim. Tempor deserunt labore esse duis id cillum consequat elit consectetur irure. Sunt excepteur anim elit dolor non.
  • Eu fugiat aliquip velit sunt duis sit non in irure voluptate sunt exercitation irure et. Dolor reprehenderit culpa consequat dolore ullamco velit deserunt. Commodo excepteur commodo in labore minim eiusmod id quis amet occaecat nostrud.
  • Nulla sint ullamco nisi culpa cupidatat laboris pariatur quis aliquip adipisicing exercitation enim. Laboris commodo consectetur laborum mollit est ut eu tempor laboris excepteur deserunt occaecat magna. Id ipsum cillum ullamco proident duis commodo aute nulla sit laboris dolor sunt irure reprehenderit. Est dolor labore Lorem reprehenderit laboris mollit deserunt minim pariatur labore. Magna culpa nisi consectetur occaecat tempor tempor nulla sunt elit reprehenderit ut eu duis.
  • Eiusmod mollit est veniam nostrud sunt consectetur. Et eiusmod deserunt reprehenderit mollit amet. Nisi ea occaecat nisi in. Minim sit cupidatat in irure cillum anim proident aute deserunt officia ea velit. Deserunt laboris sunt nostrud excepteur mollit adipisicing ea ad consectetur.

Forms

Полето е задължително.

Checkbox in Aside

Radio in Aside

Checkbox Normal

Radio Normal

Disabled Error

Полето е задължително.

Table

PERSON MOST INTEREST IN AGE
Chris HTML tables 22
Dennis Web accessibility 45
Sarah JavaScript frameworks 29
Karen Web performance 36

Grid