EXPORTSDesign exports · 設計出力

Japanese color design exports.

Production-ready files in every format designers and developers actually use. Built on the same source-aware methodology as the Chinese Color Atlas resource packs.

CSSCSS sampleDOWNLOAD ↓CJSTailwind sampleDOWNLOAD ↓JSONJSON sampleDOWNLOAD ↓
WEB · UI

CSS variables

Drop-in custom properties for any web project. Stable token names per traditional color.

WEB · UI

Tailwind tokens

Theme partial with a `japanese.*` namespace. Tailwind v3 and v4 compatible.

DESIGN TOKENS

W3C DTCG tokens

JSON design tokens following the W3C DTCG draft. Importable into modern design-system tools.

FIGMA · DESIGN

Figma Variables

JSON Variables file with primitives and semantic roles. One file per scene palette.

PRINT · BRAND

Adobe ASE

Binary swatches for Photoshop, Illustrator, and InDesign.

ILLUSTRATION

Procreate swatches

.swatches files by family and by season for iPad illustration.

AI IMAGE

AI prompt pack

Midjourney / SDXL / ComfyUI structured prompts with color names, HEX, and cultural cues.

DATA

Full JSON dataset

All atlas records — kanji, kana, romaji, English, HEX, RGB, family, season, source status, notes.

Naming convention

Stable, predictable token names.

Each traditional color gets a CSS custom property like --jp-sakura-iro and a Tailwind token like japanese.sakura_iro. Names are kebab-case in CSS, snake_case in JS/TS, derived from the atlas slug.

:root {
  --jp-sakura-iro: #F1C6C1;
  --jp-ai-iro:     #264653;
  --jp-beni:       #B33A3A;
  --jp-yamabuki-iro: #D8A431;
  --jp-sumi-iro:   #1B1B1B;
}
Waitlist · 予約

Notify me when the full pack ships.

The free sample lands first — CSS, JSON, and Tailwind for 12 colors. Bigger packs follow with Figma, ASE, Procreate, AI prompts, and the full dataset.