Design Language: TRUSTAR

Color Palette

Brand Colors

#52658c

Primary

90 uses

#f4f7f6

Secondary

13 uses

#f4f7f6

Accent

13 uses

Neutrals

#333333

617 uses

#ffffff

347 uses

#000000

71 uses

#cccccc

61 uses

#0c0c0c

38 uses

#555555

36 uses

#666666

34 uses

#6c757d

30 uses

#dddddd

11 uses

#444444

1 uses

Full Palette

#333333

text, border

617 uses

#ffffff

background, text, border

347 uses

#52658c

text, border, background

90 uses

#000000

text, border, background

71 uses

#cccccc

text, border

61 uses

#0c0c0c

text, border

38 uses

#555555

text, border

36 uses

#666666

text, border

34 uses

#6c757d

text, border

30 uses

#f4f7f6

background, border

13 uses

#007bff

text, border

12 uses

#28a745

text, border

12 uses

#dddddd

border

11 uses

#e9ecef

background

4 uses

#f05c36

text, border

2 uses

#212529

text, border

2 uses

#444444

border

1 uses

Gradients

Typography

Font Families

Type Scale

48px The quick brown fox 500 / 57.6px

32px The quick brown fox 400 / 51.2px

28.8px The quick brown fox 700 / 46.08px

28px The quick brown fox 500 / 33.6px

25px The quick brown fox 400 / 37.5px

24px The quick brown fox 500 / 28.8px

20px The quick brown fox 700 / 32px

19.2px The quick brown fox 400 / 30.72px

18px The quick brown fox 500 / 21.6px

17.6px The quick brown fox 400 / 28.16px

16px The quick brown fox 400 / 18.4px

14.4px The quick brown fox 400 / 23.04px

Accessibility

WCAG Contrast Score

103 passing / 6 failing color pairs

Color Pair Analysis

TRUSTAR

Color Palette

Brand Colors

Neutrals

Full Palette

Gradients

Typography

Font Families

Type Scale

Spacing Scale (base: 2px)

Box Shadows

Border Radii

Accessibility

Color Pair Analysis