デザイン・ファッション・印刷などの現場では、色名を3文字で略した表記が頻繁に使われます。
Web制作ではパレット管理、CSS指定、素材タグの整理などで効率化につながるため、特に需要が高い略語です。
ここでは代表的な「カラーの3文字・2文字略語」を、元の色名・由来・使用シーン・近似色コードとあわせてわかりやすく解説します。

一般的に良く使われるカラーと3文字・2文字略語まとめ

カラー	2文字	3文字	Color	色
ブラック	BK	BLK	BLACK	黒
ブラウン	BN	BRN	BROWN	茶
レッド	RD	RED	RED	赤
オレンジ	OR	ORN	ORANGE	橙
イエロー	YE	YEL	YELLOW	黄
グリーン	GN	GRN	GREEN	緑
ブルー	BL	BLU	BLUE	青
ネイビー	NV	NVY	Navy	紺
グレー	GY	GRY	GREY	灰
ホワイト	WT	WHT	WHITE	白
ピンク	PK	PNK	PINK	桃

3文字カラー略語とは？

短い形式で色指定を管理するために生まれた略語で、

• Webデザイン
• グラフィックデザイン
• ファッション
• 印刷（DTP）
  などの業界で使用されます。

3文字化するメリットは以下です：

タグ分類が簡単になる

一覧管理しやすい

英語色名を短縮できる

ファイル名・レイヤー名に使いやすい

主要な3文字カラー略語一覧【Web／デザイン実務向け】

略語	元の色名	色のイメージ	用途例	HEX	RGB
BLK	Black	無彩色の黒	フォント／背景	#000000	0,0,0
WHT	White	クリア・清潔感	背景／余白	#FFFFFF	255,255,255
RED	Red	情熱・注意	ボタン強調	#FF0000	255,0,0
GRN	Green	自然・安心	成功系UI	#00A651	0,166,81
BLU	Blue	信頼・安定	企業サイト	#007BFF	0,123,255
YEL	Yellow	注意・明るさ	注目ポイント	#FFD700	255,215,0
PUR	Purple	高級感・創造	アクセント	#800080	128,0,128
ORA	Orange	活発・カジュアル	CTAボタン	#FF9900	255,153,0
PNK	Pink	優しさ・柔らかさ	コスメ系	#FFC0CB	255,192,203
BRN	Brown	安定・クラフト系	ナチュラル系	#8B4513	139,69,19
GRY	Gray	ニュートラル	UI背景	#888888	136,136,136
NVY	Navy	知的・ビジネス	企業サイト	#001F5B	0,31,91

誤りやすい色・区別が必要な略語

GRN（緑） vs GRY（灰色）

似ており誤読されやすく、素材管理でミスが起きやすい。

● BLU（青） vs BLA（青黒い／Black関連の略語で使われることがある）

UI設計では混在させない。

● PNK（ピンク）と ROS（Rose）

海外デザインでは Rosa 系と Pink 系の境界が曖昧。

Web制作での使い方（CSS・デザインの実務例）

● ファイル名やレイヤー名で管理しやすい

例：btn_blu.png / bg_gry.svg

● カラーパレット管理で役立つ

:root {
  --PRI-BLU: #007BFF;
  --ACC-PNK: #FFC0CB;
  --BG-GRY: #F3F3F3;
}

ファッション・印刷での使い方

ファッション：季節カラーを3文字コード化（PNK、BEG、KHK など）

印刷：カラーチップの略記（RED、DBR＝Dark Brownなど）

カタログ制作：スペース削減のため略号化が一般的

カラーの3文字略語は、デザイン・ファッション・印刷など幅広い業界で使われる実務的な表記方法です。
略語を知っておくことで、パレット管理や素材整理、CSS指定、レイヤー名の統一など、制作作業を効率化できます。

本記事では代表的な3文字カラー略語を元の色名・使用シーン・カラーコードとあわせて整理しました。
誤解しやすい略語やWeb制作での使い方も解説しているため、日常のデザイン業務や資料作成で活用しやすくなっています。

色名やカラーコードは表現の幅を広げる重要な要素です。
デザインの精度を高めたい方は、他の色名辞典・配色ガイド・色コード関連記事も参考にしながら、パレットの理解をさらに深めてみてください。