日本の伝統色とCSSの名前付き色をあわせて約240色。色名・読み・カラーコードに加え、名前の由来と色の意味、相性のよい配色までを一冊に。検索して、選んで、そのままコピーできます。
色の辞書とは、色の名前・カラーコード(HEX/RGB/HSL)に加えて、名前の由来と色が持つ意味・印象をまとめた辞典です。同じ色でも「なぜその名前なのか」を知ると、配色の意図を言葉で説明でき、デザインの説得力が増します。
このツールは、千年以上の歴史を持つ日本の伝統色100色と、Webでそのまま使えるCSSの名前付き色約140色(gray/grey などの綴り違いは1色に統合)を、同じ画面で横断的に引けるようにしたものです。色相やカテゴリで絞り込み、気になった色はクリックすれば、由来・意味・相性のよい配色・コントラスト比まで確認できます。
日本の伝統色は、植物や鉱物の染料・顔料、あるいは自然や暮らしの情景から名づけられてきました。たとえば「茜色」はアカネの根で染めた赤、「浅葱色」はネギの若葉のような薄い青緑、「江戸紫」は江戸で愛された青みの紫を指します。名前を知ることは、その色がまとう文化的な背景を知ることでもあります。
CSSには crimson や teal のように、HEXの代わりに直接書けるカラーキーワードが147色定義されています(W3C仕様)。color: crimson; のように記述でき、コードの可読性が上がります。これらの名前にも由来があり、crimson はエンジムシ由来の深紅、rebeccapurple はCSS界の故人を追悼して2014年に追加された紫です。
はい。完全無料・登録不要です。表示されるカラーコードは商用・個人を問わずそのまま利用できます。
各色の詳細画面でHEX・RGB・HSLの3形式をワンクリックでコピーできます。一覧カードからはHEXをすばやくコピーできます。
漢字の色名・ひらがな・ローマ字・英語名・HEXのいずれでも検索できます。色相やカテゴリでの絞り込みにも対応しています。
詳細画面で、白背景・黒背景とのコントラスト比とWCAG等級(AA/AAA)を表示します。アクセシブルな配色の判断に使えます。
日本の伝統色100色と、CSSの名前付き色約140色(gray/grey などの綴り違いは1色に統合)を収録しています。今後も拡充予定です。