Colors

The BigDesign color system has five palette types named semantically for their use across the application. The color system is derived from the BigCommerce brand and provides a consistent user experience for our merchants and partners.

BigDesign uses color tokens to manage colors within each palette and are named for their role or hierarchy in the palette. Color tokens improve communication between design and development and establish an organized use of color in the BigCommerce application.

Accent colors are used for interactions or to denote an interaction has taken place. Common accent uses include buttons, icons, navigation, links and selections. Use accent colors sparingly to avoid confusion.

Type colors are used for text, iconography, and foreground elements in BigDesign interfaces.

Fills and strokes are used as the building blocks of BigDesign interfaces. They are used in combination to create layering of backgrounds, panels, overlays and hierarchical UI elements.

Status colors are reserved to indicate a system status such as errors, success or warnings. These colors should be used sparingly and only for imformative purposes.

Additional colors exist in the BigDesign color palette for edge cases and BigCommerce branding.