使い方ガイド
CSV 仕様と使い方
CSV の列仕様、インポートルール、seed パレットについて確認できます。
01
インポートの仕組み
light は必須で、dark は任意です
dark を入力する場合は必須最小セットをすべて埋めます
CSV インポートでは imported パレットだけが全件置換されます
seed パレットと manual パレットは CSV インポートで削除されません
02
light / dark ルール
すべてのパレットは light バリアントが必須です。dark バリアントは任意ですが、入力する場合は必須最小セット（primary, surface, background, foreground, border）をすべて埋める必要があります。
dark が未指定のパレットでは、アプリ側でダーク表示を自動生成しません。プレビューや比較でもライトのみが表示されます。
03
基本列
パレット名やタグなどのメタ情報を指定する列です。
| 列名 | 区分 | 説明 |
|---|---|---|
| palette_name | 必須 | パレット名 |
| description | 任意 | 説明文 |
| tags | 任意 | タグ。| 区切りで複数指定 |
| source_reference | 任意 | 参照元 URL やメモ |
04
light 列
ライトバリアントの色を #RRGGBB 形式で指定します。必須列はすべて入力してください。
| 列名 | 区分 | 説明 |
|---|---|---|
| light_primary | 必須 | ライトの主色 |
| light_secondary | 任意 | ライトの補助色 |
| light_accent | 任意 | ライトの強調色 |
| light_surface | 必須 | ライトの面色 |
| light_background | 必須 | ライトの背景色 |
| light_foreground | 必須 | ライトの文字色 |
| light_muted | 任意 | ライトの弱い色 |
| light_border | 必須 | ライトの境界線色 |
| light_ring | 任意 | ライトのフォーカスリング色 |
| light_success | 任意 | ライトの成功色 |
| light_warning | 任意 | ライトの警告色 |
| light_danger | 任意 | ライトの危険色 |
| light_info | 任意 | ライトの情報色 |
05
dark 列
ダークバリアントの色を指定します。入力する場合は primary, surface, background, foreground, border の 5 列をすべて埋めます。
| 列名 | 区分 | 説明 |
|---|---|---|
| dark_primary | 任意 | ダークの主色 |
| dark_secondary | 任意 | ダークの補助色 |
| dark_accent | 任意 | ダークの強調色 |
| dark_surface | 任意 | ダークの面色 |
| dark_background | 任意 | ダークの背景色 |
| dark_foreground | 任意 | ダークの文字色 |
| dark_muted | 任意 | ダークの弱い色 |
| dark_border | 任意 | ダークの境界線色 |
| dark_ring | 任意 | ダークのフォーカスリング色 |
| dark_success | 任意 | ダークの成功色 |
| dark_warning | 任意 | ダークの警告色 |
| dark_danger | 任意 | ダークの危険色 |
| dark_info | 任意 | ダークの情報色 |
06
tags の記法
複数のタグは |（パイプ）区切りで指定します。
modern|blue|dark-theme07
サンプル CSV
以下はすべての列を含むサンプルです。
sample.csv
palette_name,description,tags,source_reference,light_primary,light_secondary,light_accent,light_surface,light_background,light_foreground,light_muted,light_border,light_ring,light_success,light_warning,light_danger,light_info,dark_primary,dark_secondary,dark_accent,dark_surface,dark_background,dark_foreground,dark_muted,dark_border,dark_ring,dark_success,dark_warning,dark_danger,dark_info
Guide Sample,Guide sample palette,guide|sample,https://example.com/guide-sample,#1D4ED8,#334155,#0F766E,#FFFFFF,#F8FAFC,#0F172A,#64748B,#CBD5E1,#2563EB,#15803D,#D97706,#DC2626,#0284C7,#60A5FA,#94A3B8,#2DD4BF,#111827,#020617,#F8FAFC,#94A3B8,#334155,#60A5FA,#4ADE80,#FBBF24,#F87171,#38BDF808
seed パレットについて
アプリには初期状態で 3 件の seed パレットが含まれています。seed パレットはベースライン比較用のデータであり、CSV インポートや手動操作で削除・アーカイブすることはできません。
ID:
seed-1seed-2seed-3