Primitive Color Tokens - Hive Design System

Overview

Figma

The Hive Design System's primitive color palette forms the foundational spectrum from which our Design Tokens are derived. This palette encompasses a range of essential colors, categorized into Neutrals, Brand, and Accent color scales. Each of these categories plays a crucial role in establishing a cohesive visual language and serves as the base for our semantic approach to design tokens.

Purpose and Usage

Designers and developers should use these colors as a guide to understand the underlying structure of our design system's color scheme. By doing so, they can ensure consistency, harmony, and accessibility across all digital experiences crafted within the Hive ecosystem.

Neutrals

$color-neutral-light-0

Offer a versatile range of greys and blacks, providing depth, contrast, and balance to designs.

Brand

$color-brand-light-100
$color-brand-dark-100

Reflects the core identity colors of Hive, encapsulating the essence and values of our brand.

Accent

$color-purple-light-100
$color-purple-dark-100

Comprises vibrant hues used sparingly to highlight, emphasize, or draw attention to specific elements.

Overview

Figma

The Hive Design System's primitive color palette forms the foundational spectrum from which our Design Tokens are derived. This palette encompasses a range of essential colors, categorized into Neutrals, Brand, and Accent color scales. Each of these categories plays a crucial role in establishing a cohesive visual language and serves as the base for our semantic approach to design tokens.

Purpose and Usage

Designers and developers should use these colors as a guide to understand the underlying structure of our design system's color scheme. By doing so, they can ensure consistency, harmony, and accessibility across all digital experiences crafted within the Hive ecosystem.

Neutrals

$color-neutral-light-0

Offer a versatile range of greys and blacks, providing depth, contrast, and balance to designs.

Brand

$color-brand-light-100
$color-brand-dark-100

Reflects the core identity colors of Hive, encapsulating the essence and values of our brand.

Accent

$color-purple-light-100
$color-purple-dark-100

Comprises vibrant hues used sparingly to highlight, emphasize, or draw attention to specific elements.

Overview

Figma

The Hive Design System's primitive color palette forms the foundational spectrum from which our Design Tokens are derived. This palette encompasses a range of essential colors, categorized into Neutrals, Brand, and Accent color scales. Each of these categories plays a crucial role in establishing a cohesive visual language and serves as the base for our semantic approach to design tokens.

Purpose and Usage

Designers and developers should use these colors as a guide to understand the underlying structure of our design system's color scheme. By doing so, they can ensure consistency, harmony, and accessibility across all digital experiences crafted within the Hive ecosystem.

Neutrals

$color-neutral-light-0

Offer a versatile range of greys and blacks, providing depth, contrast, and balance to designs.

Brand

$color-brand-light-100
$color-brand-dark-100

Reflects the core identity colors of Hive, encapsulating the essence and values of our brand.

Accent

$color-purple-light-100
$color-purple-dark-100

Comprises vibrant hues used sparingly to highlight, emphasize, or draw attention to specific elements.