Discover silkcashback.com design foundations
Learn how silkcashback.com uses colors and fonts to enhance user experience and design coherence.
Last update: 06/28/2024
ICONS
TYPOGRAPHIES
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !@#$%^&*()
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !@#$%^&*()
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !@#$%^&*()
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !@#$%^&*()
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !@#$%^&*()
COLORS
CALL TO ACTION
The call to action color is specifically chosen to stand out on the page. It's used on elements that require user interaction or urgent attention, such as "submit" buttons, promotional banners, or important links.
50
50
#ffffff
100
100
#ffffff
200
200
#dbdeff
300
300
#a8b0ff
400
400
#7581ff
500
500
#4252ff
600
600
#0f23ff
700
700
#0012db
800
800
#000ea8
900
900
#000a75
950
950
#000642
HERO
The hero color is used to draw attention to the most important content on the page. It's the main color used on content above the fold.
50
50
#ffffff
100
100
#ffffff
200
200
#ffffff
300
300
#ffffff
400
400
#f7f7f7
500
500
#dedede
600
600
#c4c4c4
700
700
#ababab
800
800
#919191
900
900
#787878
950
950
#5e5e5e
ACCENT
The accent color is used to highlight important elements on the page, such as headings, links, or buttons. It's a secondary color that complements the primary color scheme.
50
50
#ffffff
100
100
#ffffff
200
200
#fcf1e3
300
300
#f7d9b6
400
400
#f2c288
500
500
#edab5a
600
600
#e8932c
700
700
#ca7916
800
800
#9c5e11
900
900
#6e420c
950
950
#402707
BACKGROUND
The background color is the primary color used in the background of the page. It's a neutral color that provides a backdrop for the content on the page.
50
50
#ffffff
100
100
#ffffff
200
200
#ffffff
300
300
#ffffff
400
400
#f7f7f7
500
500
#dedede
600
600
#c4c4c4
700
700
#ababab
800
800
#919191
900
900
#787878
950
950
#5e5e5e
SURFACE
The surface color is used to create depth and dimension on the page. It's a light color that's used on elements like cards, modals, and other surfaces that need to stand out from the background.
50
50
#ffffff
100
100
#ffffff
200
200
#ffffff
300
300
#ffffff
400
400
#ffffff
500
500
#f0f3ff
600
600
#bdcbff
700
700
#8aa3ff
800
800
#577bff
900
900
#2453ff
950
950
#0034f0
