色名 · #D5B60A
Lionhead
Lionheadは#D5B60A：rgb(213 182 10)、hsl(51 91% 44%)、oklch(0.78 0.159 96.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Lionhead color name →
#D5B60A
oklch(0.78 0.159 96.6)
カラー変換
- HEX
- #d5b60a
- RGB
- rgb(213 182 10)
- HSL
- hsl(51 91% 44%)
- HWB
- hwb(51 4% 16%)
- OKLCH
- oklch(0.78 0.159 96.6)
- OKLab
- oklab(0.78 -0.018 0.158)
- CIE Lab
- lab(75.05 1.24 74.99)
- LCH
- lch(75.05 75 89.1)
- CMYK
- cmyk(0% 15% 95% 16%)
ティント · シェード · トーン
ティント
- D9BE40
- DDC55D
- E1CD74
- E5D48A
- EADB9F
- EEE3B3
- F2EAC6
- F6F1D9
- FBF8EC
シェード
- B99E07
- 9E8605
- 836F03
- 6A5902
- 514401
- 3A3001
- 241D00
- 100C00
- 020200
トーン
- CCB12F
- C3AC41
- BBA64E
- B2A158
- A99C61
- A19669
- 999170
- 908B76
- 88867B
カラーハーモニー
補色 +180°
- D5B60A
Lionhead
- A4B1FF
≈ Shy Moment
類似色 -30° +30°
- D5B60A
Lionhead
- FAA02E
≈ Lightning Yellow
- 9DC94E
≈ Seductive Thorns
トライアド +120° +240°
- D5B60A
Lionhead
- 00CCF0
≈ Picnic Day Sky
- F68DDD
≈ Pink Delight
スプリットコンプリメンタリー +150° +210°
- D5B60A
Lionhead
- 75BEFF
≈ Green Darner Tail
- CF9EFF
≈ Hydrangea Purple
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.99:1 · APCA Lc 38
Ag
AAA黒の上
WCAG 10.52:1 · APCA Lc 64
最適な文字色: #000000
WCAG 10.52:1 (AAA) · APCA Lc 64
Contrast pairs
コードスニペット
CSS
:root {
--lionhead: #d5b60a;
--lionhead-rgb: 213 182 10;
--lionhead-oklch: oklch(0.78 0.159 96.6);
}
.element {
color: var(--lionhead);
background-color: hsl(51 91% 44%);
border-color: oklch(0.78 0.159 96.6);
}Tailwind CSS v4
@theme {
--color-lionhead: #d5b60a;
--color-lionhead-50: #fff7c2;
--color-lionhead-100: #f5e9ac;
--color-lionhead-200: #e5d684;
--color-lionhead-300: #ccb84e;
--color-lionhead-400: #ba9d00;
--color-lionhead-500: #a58300;
--color-lionhead-600: #8c6f00;
--color-lionhead-700: #705900;
--color-lionhead-800: #544000;
--color-lionhead-900: #3b2c00;
--color-lionhead-950: #251900;
}SCSS
$lionhead: #d5b60a;
$lionhead-rgb: 213, 182, 10;
$lionhead-light: mix(#fff, $lionhead, 20%);
$lionhead-dark: mix(#000, $lionhead, 20%);
.element {
color: $lionhead;
box-shadow: 0 0 0 2px rgba($lionhead, 0.35);
}