セマンティックカラーの3層構造
収録 2026-10
セマンティックカラーの3層構造(中国語の原文)
现在有 [42] 个散落的色值,主题要支持 [默认] 和 [品牌联名] 两套。请设计三层结构:基础色(命名到 [blue-500] 这种粒度)、语义色(surface、text-secondary、danger 之类)、组件色(button-primary-bg 之类)。给出每层的命名规则和三条引用链示例,说明联名主题切换时哪层要改、哪层完全不动。
当サイトオリジナル
中国語の原文
使用例
入力例
现在有四十多个散落色值,主题要支持默认和品牌联名两套,帮我设计三层色彩结构。
出力に含まれるもの
- 三层命名规则与引用链示例
- 主题切换时哪层改哪层不动
- 说明组件色如何引用语义色
置き換えるプレースホルダー 4
括弧の中をご自身の情報に置き換えてから送ってください。
[42][默认][品牌联名][blue-500]
使い方
组件里直接写色值是最常见的债,先禁掉再谈主题化。
こう変えてみる
- スタイル語を、光・レンズ・素材・構図などの測定可能なパラメータに置き換える。
- 同じプロンプトで三つのバリエーションを出させ、差分を比べる。
得られる成果物
- そのまま指定できるパラメータ表(光・レンズ・素材・構図)
- 二〜三の代替案とそれぞれの取舍
よくある失敗
- 「高級感・シネマティック・8K」を並べると毎回結果が変わる。
- 実在ブランドや著名人の再現を求め、似ているが使えない画像になる。
出力のチェック
- パラメータが実行可能で、ツールやデザイナーにそのまま渡せる。
- なぜその光・構図なのか、取捨選択の理由がある。
使いどころと注意
- 向いている用途:曖昧な「高級感」を光・素材・レンズ・構図などの具体的なパラメータに分解する。
- 注意:実在のブランド・著名人・他人の作品は、権利侵害を避けて等価な表現に置き換える。