色名 · #4A6871
Azalea Leaf
Azalea Leafは#4A6871：rgb(74 104 113)、hsl(194 21% 37%)、oklch(0.497 0.038 218.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Cyan mean? → · Azalea Leaf color name →
#4A6871
oklch(0.497 0.038 218.3)
カラー変換
- HEX
- #4a6871
- RGB
- rgb(74 104 113)
- HSL
- hsl(194 21% 37%)
- HWB
- hwb(194 29% 56%)
- OKLCH
- oklch(0.497 0.038 218.3)
- OKLab
- oklab(0.497 -0.03 -0.023)
- CIE Lab
- lab(41.92 -9.54 -8.8)
- LCH
- lch(41.92 12.97 222.7)
- CMYK
- cmyk(35% 8% 0% 56%)
ティント · シェード · トーン
ティント
- 5B767E
- 6C848C
- 7D9399
- 8FA2A7
- A1B1B6
- B3C0C4
- C6CFD2
- D9DFE1
- ECEFF0
シェード
- 3F5961
- 354B52
- 2A3E43
- 203035
- 172427
- 0E181A
- 060C0E
- 020404
- 000001
トーン
- 506A73
- 556D74
- 5B6F76
- 607277
- 657479
- 6B767A
- 70797C
- 757B7D
- 7B7E7F
カラーハーモニー
補色 +180°
- 4A6871
Azalea Leaf
- 765B53
≈ Picador
類似色 -30° +30°
- 4A6871
Azalea Leaf
- 496A67
≈ Pond Newt
- 526577
≈ Prairie Denim
トライアド +120° +240°
- 4A6871
Azalea Leaf
- 715A6A
≈ Dark Purple Grey
- 68634A
≈ Winter Moss
スプリットコンプリメンタリー +150° +210°
- 4A6871
Azalea Leaf
- 765A5E
≈ Falcon Wing
- 715F4B
≈ Stampede
テトラード +90° +180° +270°
- 4A6871
Azalea Leaf
- 695D73
≈ Violet Haze
- 765B53
≈ Picador
- 5C6750
≈ Monstera
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 5.98:1 · APCA Lc 80
Ag
Fail黒の上
WCAG 3.50:1 · APCA Lc 22
最適な文字色: #FFFFFF
WCAG 5.98:1 (AA) · APCA Lc 80
Contrast pairs
コードスニペット
CSS
:root {
--azalea-leaf: #4a6871;
--azalea-leaf-rgb: 74 104 113;
--azalea-leaf-oklch: oklch(0.497 0.038 218.3);
}
.element {
color: var(--azalea-leaf);
background-color: hsl(194 21% 37%);
border-color: oklch(0.497 0.038 218.3);
}Tailwind CSS v4
@theme {
--color-azalea-leaf: #4a6871;
--color-azalea-leaf-50: #eaf8fd;
--color-azalea-leaf-100: #dbebf1;
--color-azalea-leaf-200: #c3d8e0;
--color-azalea-leaf-300: #a3bcc5;
--color-azalea-leaf-400: #86a4ad;
--color-azalea-leaf-500: #6a8d97;
--color-azalea-leaf-600: #5a7780;
--color-azalea-leaf-700: #485f66;
--color-azalea-leaf-800: #34464b;
--color-azalea-leaf-900: #233034;
--color-azalea-leaf-950: #121d1f;
}SCSS
$azalea-leaf: #4a6871;
$azalea-leaf-rgb: 74, 104, 113;
$azalea-leaf-light: mix(#fff, $azalea-leaf, 20%);
$azalea-leaf-dark: mix(#000, $azalea-leaf, 20%);
.element {
color: $azalea-leaf;
box-shadow: 0 0 0 2px rgba($azalea-leaf, 0.35);
}