Open Color textile direction

Open Blue Tonal Cloth textile color palette

A controlled blue ladder for range planning, trims, labels, and fabric color approvals. The values come from the MIT-licensed Open Color system, then are arranged here as a textile-ready story with roles for anchors, body cloth, grounds, and trims rather than as a UI-only scale.

clearfreshcommercialtonal
Open Library

Textile Direction

How to use Open Blue Tonal Cloth

Best For

  • blue product families
  • tonal capsule planning
  • woven labels and trims
  • digital-to-fabric handoff

Materials

  • cotton twill
  • piece-dyed jersey
  • washed poplin
  • woven tape

Color Roles

  • Use the two darkest blue values for anchors, typography, buttons, or structural panels.
  • Let the middle blue values carry main fabric options when the range needs visible steps.
  • Reserve the pale values for linings, grounds, packaging, and digital backgrounds.

Color Specs

Palette values and contrast notes

Use these values as digital starting points, then approve final textile standards on the real fabric or substrate.

6 colors
SwatchRoleHEXRGBHSLApprox CMYKText Contrast
Anchor
Depth
Mid tone
Bridge
Ground
Highlight

Developer Handoff

CSS variables

Copy the palette as CSS custom properties.

--palette-1: #1864AB;
--palette-2: #1971C2;
--palette-3: #1C7ED6;
--palette-4: #339AF0;
--palette-5: #74C0FC;
--palette-6: #D0EBFF;

Tailwind v4 theme

Use these tokens as palette utilities like bg-palette-1 and text-palette-1.

Copy the palette as Tailwind v4 theme color tokens.

@theme {
  --color-palette-1: #1864AB;
  --color-palette-2: #1971C2;
  --color-palette-3: #1C7ED6;
  --color-palette-4: #339AF0;
  --color-palette-5: #74C0FC;
  --color-palette-6: #D0EBFF;
}

Related Palettes

Similar textile color stories