Primary Colors

Primary Colors

The primary colors are the colors used throughout Cupcake’s elements and components that help give visual context, emphasize meaning and to aesthetically style the user interface.

We have included styling classes for you that support varying hues and brightness of the base colors shown below on the far left. These styling classes style the fill color of elements (“-bg-“), fonts or font-based icons (“-text-“) and borders (“-bd-“).

• .c-bg-{color-name}-{color-shade}
• .c-text-{color-name}-{color-shade}
• .c-bd-{color-name}-{color-shade}