Color
Last updated: 4/19/21
Colors
Gradients
-bgc-primaryBoulevard-0-bgc-primaryBoulevard-90-bgc-primaryBoulevard-180-bgc-primaryBoulevard-270-bgc-deepOcean-0-bgc-deepOcean-90-bgc-deepOcean-180-bgc-deepOcean-270-bgc-neonSky-0-bgc-neonSky-90-bgc-neonSky-180-bgc-neonSky-270-bgc-earlySunset-0-bgc-earlySunset-90-bgc-earlySunset-180-bgc-earlySunset-270-bgc-firesideGlow-0-bgc-firesideGlow-90-bgc-firesideGlow-180-bgc-firesideGlow-270Light Grays
-bgc-white-c-white-bdc-white-bgc-light-3-c-light-3-bdc-light-3-bgc-light-2-c-light-2-bdc-light-2-bgc-light-1-c-light-1-bdc-light-1-bgc-gray-4-c-gray-4-bdc-gray-4-bgc-gray-3-c-gray-3-bdc-gray-3Dark Grays
-bgc-gray-2-c-gray-2-bdc-gray-2-bgc-gray-c-gray-bdc-gray-bgc-dark-1-c-dark-1-bdc-dark-1-bgc-dark-2-c-dark-2-bdc-dark-2-bgc-dark-3-c-dark-3-bdc-dark-3-bgc-dark-4-c-dark-4-bdc-dark-4-bgc-black-c-black-bdc-blackPrimary
-bgc-cyan-light-4-c-cyan-light-4-bdc-cyan-light-4-bgc-cyan-light-3-c-cyan-light-3-bdc-cyan-light-3-bgc-cyan-light-2-c-cyan-light-2-bdc-cyan-light-2-bgc-cyan-c-cyan-bdc-cyan-bgc-cyan-dark-1-c-cyan-dark-1-bdc-cyan-dark-1-bgc-cyan-dark-2-c-cyan-dark-2-bdc-cyan-dark-2-bgc-cyan-dark-3-c-cyan-dark-3-bdc-cyan-dark-3-bgc-cyan-dark-4-c-cyan-dark-4-bdc-cyan-dark-4Green
-bgc-green-light-4-c-green-light-4-bdc-green-light-4-bgc-green-light-3-c-green-light-3-bdc-green-light-3-bgc-green-light-2-c-green-light-2-bdc-green-light-2-bgc-green-c-green-bdc-green-bgc-green-dark-1-c-green-dark-1-bdc-green-dark-1-bgc-green-dark-2-c-green-dark-2-bdc-green-dark-2-bgc-green-dark-3-c-green-dark-3-bdc-green-dark-3-bgc-green-dark-4-c-green-dark-4-bdc-green-dark-4Blue
-bgc-blue-light-4-c-blue-light-4-bdc-blue-light-4-bgc-blue-light-3-c-blue-light-3-bdc-blue-light-3-bgc-blue-light-2-c-blue-light-2-bdc-blue-light-2-bgc-blue-c-blue-bdc-blue-bgc-blue-dark-1-c-blue-dark-1-bdc-blue-dark-1-bgc-blue-dark-2-c-blue-dark-2-bdc-blue-dark-2-bgc-blue-dark-3-c-blue-dark-3-bdc-blue-dark-3-bgc-blue-dark-4-c-blue-dark-4-bdc-blue-dark-4Teal
-bgc-teal-light-4-c-teal-light-4-bdc-teal-light-4-bgc-teal-light-3-c-teal-light-3-bdc-teal-light-3-bgc-teal-light-2-c-teal-light-2-bdc-teal-light-2-bgc-teal-c-teal-bdc-teal-bgc-teal-dark-1-c-teal-dark-1-bdc-teal-dark-1-bgc-teal-dark-2-c-teal-dark-2-bdc-teal-dark-2-bgc-teal-dark-3-c-teal-dark-3-bdc-teal-dark-3-bgc-teal-dark-4-c-teal-dark-4-bdc-teal-dark-4Yellow
-bgc-yellow-light-4-c-yellow-light-4-bdc-yellow-light-4-bgc-yellow-light-3-c-yellow-light-3-bdc-yellow-light-3-bgc-yellow-light-2-c-yellow-light-2-bdc-yellow-light-2-bgc-yellow-c-yellow-bdc-yellow-bgc-yellow-dark-1-c-yellow-dark-1-bdc-yellow-dark-1-bgc-yellow-dark-2-c-yellow-dark-2-bdc-yellow-dark-2-bgc-yellow-dark-3-c-yellow-dark-3-bdc-yellow-dark-3-bgc-yellow-dark-4-c-yellow-dark-4-bdc-yellow-dark-4Orange
-bgc-orange-light-4-c-orange-light-4-bdc-orange-light-4-bgc-orange-light-3-c-orange-light-3-bdc-orange-light-3-bgc-orange-light-2-c-orange-light-2-bdc-orange-light-2-bgc-orange-c-orange-bdc-orange-bgc-orange-dark-1-c-orange-dark-1-bdc-orange-dark-1-bgc-orange-dark-2-c-orange-dark-2-bdc-orange-dark-2-bgc-orange-dark-3-c-orange-dark-3-bdc-orange-dark-3-bgc-orange-dark-4-c-orange-dark-4-bdc-orange-dark-4Red
-bgc-red-light-4-c-red-light-4-bdc-red-light-4-bgc-red-light-3-c-red-light-3-bdc-red-light-3-bgc-red-light-2-c-red-light-2-bdc-red-light-2-bgc-red-c-red-bdc-red-bgc-red-dark-1-c-red-dark-1-bdc-red-dark-1-bgc-red-dark-2-c-red-dark-2-bdc-red-dark-2-bgc-red-dark-3-c-red-dark-3-bdc-red-dark-3-bgc-red-dark-4-c-red-dark-4-bdc-red-dark-4-bgc-[color]-[shade]
Sets the background color to a specified color and shade. Example: '-bgc-blue-dark-2' sets the background color to blue-dark-2.
-bdc-[color]-[shade]
Sets the border color to a specified color and shade. Example: '-bdc-blue-dark-2' sets the border color to blue-dark-2.
-c-[color]-[shade]
Sets the text color to a specified color and shade. Example: '-c-blue-dark-2' sets the text color to blue-dark-2.
-bgc-[gradient]-[angle]
Sets the background to a specified gradient and angle. Example: '-bgc-primaryBoulevard-90' sets the background to a linear-gradient with the Primary Boulevard color with an angle of 90.
© 2021 Gumgum, Inc.