スキントーン：
多様な美のパレット
科学的に精緻なHEXコードを備えた、ヒトの肌色の包括的なパレット。人類の美しい多様性を表現する、インクルーシブなデザインのために。
なぜインクルーシブな配色が必要なのか
デザインにおいて「表現（レプリゼンテーション）」は重要です。キャラクター制作、アバター開発、コスメ開発、あるいは医学的なイラスト。正確なスキントーンを持つことは、多様なオーディエンスにあなたの作品を共鳴させるために不可欠です。
このパレットは、紫外線に対するヒトの皮膚の反応によって分類される皮膚科学の標準、フィッツパトリックの尺度に基づいています。これは、ヒトの肌色の全スペクトルを表現するための最も科学的に精緻な方法です。
デザイン活用事例
メイン・スキントーン・パレット
科学的に裏付けられた6つの肌色スペクトル
ポーセリン / ベリー・フェア
Type I最も明るい肌色。日焼けしやすく、黒くなりにくいタイプ。
フェア / ライト
Type II明るい肌色。日焼けしやすく、定着しにくい。
ライト・ミディアム
Type III明るめから標準的な肌色。徐々に日焼けが定着するタイプ。
ミディアム / オリーブ
Type IV標準からオリーブ系の肌色。日焼けしやすく、黒くなりやすい。
ミディアム・ブラウン
Type V褐色の肌。非常に日焼けしやすく、濃い色素を持つ。
ダーク・ブラウン / ディープ
Type VI深みのある暗褐色の肌。日焼けによる炎症はなく、極めて濃い色素を持つ。
拡張スキントーン・スペクトル
スキントーンを美しく見せる補完色
ウォームブラッシュ
#FFB6A3チークカラー、温かみ
ナチュラルリップ
#C47165唇の色調、自然な美しさ
ソフトハイライト
#FFEFC7ハイライター、輝き
ダークコントゥア
#8B5A3Cシェーディング、奥行き
スキントーン設計のベストプラクティス
表現の多様性
デザインには常に幅広いスキントーンを含めるようにしましょう。少なくともフィッツパトリックの6つのタイプをキャラクター選択やアバターシステムに反映させることが標準的な指標です。
ステレオタイプを避ける
特定のスキントーンと、特定の役割、職業、または性格的特徴を結び付けないでください。スキントーンをキャラクターのアイデンティティの一部とし、それを定義する特徴にしないようにしましょう。
コンテキストを超えたテスト
スキントーンは、照明、周囲の色、およびディスプレイ設定によって見え方が異なります。常に複数の文脈や環境で、色の選択をテストしてください。
アンダートーンの考慮
実際の肌には、クール、ウォーム、またはニュートラルなアンダートーンがあります。よりリアルな表現のためには、ベースとなる肌色の下に、ピンク、イエロー、またはブルーの微妙な色合いを重ねることを検討してください。
CSS スキントーン・グラデーション
インクルーシブなデザインのための、自然な肌色の階調コード
ナチュラルスキントーン・グラデーション (Light to Dark)
background: linear-gradient(90deg, #FFE5D9 0%, #EBC4AF 50%, #8D5524 100%);ミディアム・スキントーン・スペクトル
background: linear-gradient(135deg, #F5D0C5 0%, #EBC4AF 25%, #D4A574 50%, #C68642 75%, #8D5524 100%);クイック・リファレンス
| 名称 | HEX | フィッツパトリック |
|---|---|---|
| ポーセリン / ベリー・フェア | #FFE5D9 | Type I |
| フェア / ライト | #F5D0C5 | Type II |
| ライト・ミディアム | #EBC4AF | Type III |
| ミディアム / オリーブ | #D4A574 | Type IV |
| ミディアム・ブラウン | #C68642 | Type V |
| ダーク・ブラウン / ディープ | #8D5524 | Type VI |
Explore Our Color Library
Discover our complete collection of color guides with HEX codes, palettes, and design inspiration.