OCS for Designers

OCS gives you a shared vocabulary for color that works across tools, teams, and output media. Here's how to integrate it into your design workflow.

Finding Colors

The Color Library is your starting point. You can filter by:

• Lightness — find dark tones, mid-tones, or pastels
• Chroma — separate muted, soft, and vivid colors
• Hue — narrow to a specific color family
• Substrate — see only colors for your output medium

Building Palettes

Every color detail page shows perceptual relationships: complementary, analogous, triadic, and lightness/chroma variants. These relationships are computed in LCH space, so they're perceptually balanced—not just mathematically symmetric.

Use these as starting points for your palette, then refine with the Color Picker.

Communicating with Teams

Instead of sharing hex codes that mean nothing without context, share OCS IDs. When you write OCS-7055-025-C, your developer knows the exact color, your printer knows the substrate intent, and your team can look it up instantly.

Cross-Media Design

If your project spans screen and print, the substrate code matters. The same base color shifts when moving from coated paper (C) to uncoated (U) to textile (T). Use the Substrate Simulator to preview these shifts before committing to a palette.

Export Options

Each color in OCS comes with multiple export values:

• Hex for Figma, Sketch, and web tools
• RGB for any design application
• LCH for CSS-native use and wide-gamut workflows
• JSON for design token integration