Style Guide

Colors and components making up Pony Foo ❤️


Grayscale colors

True WhiteWhiteBrowser GraySlightly Lighter Gray
Lighter GrayLight GrayGrayDark Gray
Darker GrayBlackBlack LightBlack Text

Primary colors

Bright YellowDark GreenDark OrangeYellow Highlight
PinkTealPurpleDark Turquoise

Variants to primary colors

GreenRedYellowDark Green 0.5
OrangeBrighter TurquoiseBright TurquoiseLight Turquoise

Light color variants

Yellow Highlight 0.8Yellow 0.75Light YellowYellow 0.4
Yellow Highlight 0.4Yellow Highlight 0.2Yellow 0.05Light Orange
Green 0.05Yellow 0.3Yellow Highlight 0.1Yellow 0.1
Turquoise 0.1Orange 0.05Dark Green 0.1Pink Light 0.05
Light GreenDark Turquoise 0.05Pink 0.05Red 0.05
LightPurple 0.05Pink Light 0.1Orange Light
Pink 0.1Orange 0.6Blue 0.1Dark Turquoise 0.15
Purple 0.1Purple 0.2Pink LightBlue 0.2
Dark Turquoise 0.5Pink Lightspin

Component-related colors

Rome Disabled

Brand colors

Gmail RedChrome BlueOreilly Teal 0.3Slack Green
Twitter BlueOreilly TealFacebook BlueSlack Purple