色名 · #9D96B2
Heirloom Lilac
Heirloom Lilacは#9D96B2：rgb(157 150 178)、hsl(255 15% 64%)、oklch(0.688 0.041 296.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Heirloom Lilac color name →
#9D96B2
oklch(0.688 0.041 296.7)
カラー変換
- HEX
- #9d96b2
- RGB
- rgb(157 150 178)
- HSL
- hsl(255 15% 64%)
- HWB
- hwb(255 59% 30%)
- OKLCH
- oklch(0.688 0.041 296.7)
- OKLab
- oklab(0.688 0.019 -0.037)
- CIE Lab
- lab(63.4 6.87 -13.7)
- LCH
- lch(63.4 15.33 296.6)
- CMYK
- cmyk(12% 16% 0% 30%)
ティント · シェード · トーン
ティント
- A6A0BA
- B0AAC1
- B9B5C9
- C3BFD0
- CDC9D8
- D7D4E0
- E1DFE8
- EBE9EF
- F5F4F7
シェード
- 88829A
- 736E83
- 5F5B6D
- 4C4957
- 3A3743
- 28262F
- 18161D
- 09080C
- 010101
トーン
- 9A94AD
- 9792A8
- 948FA3
- 918D9E
- 8E8B99
- 8B8994
- 89878F
- 86848A
- 838285
カラーハーモニー
補色 +180°
- 9D96B2
Heirloom Lilac
- 999F82
≈ Fennelly
類似色 -30° +30°
- 9D96B2
Heirloom Lilac
- 8F9BB5
≈ Blueberry Buckle
- A992A9
≈ Garden Flower
トライアド +120° +240°
- 9D96B2
Heirloom Lilac
- AF9582
≈ Mexican Sand
- 80A49A
≈ Verdigreen
スプリットコンプリメンタリー +150° +210°
- 9D96B2
Heirloom Lilac
- A69A7E
≈ Mohalla
- 8BA28C
≈ Envy
テトラード +90° +180° +270°
- 9D96B2
Heirloom Lilac
- B3928D
≈ Plush Suede
- 999F82
≈ Fennelly
- 7DA3A8
≈ Tourmaline
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.82:1 · APCA Lc 54
Ag
AAA黒の上
WCAG 7.43:1 · APCA Lc 48
最適な文字色: #000000
WCAG 7.43:1 (AAA) · APCA Lc 48
Contrast pairs
コードスニペット
CSS
:root {
--heirloom-lilac: #9d96b2;
--heirloom-lilac-rgb: 157 150 178;
--heirloom-lilac-oklch: oklch(0.688 0.041 296.7);
}
.element {
color: var(--heirloom-lilac);
background-color: hsl(255 15% 64%);
border-color: oklch(0.688 0.041 296.7);
}Tailwind CSS v4
@theme {
--color-heirloom-lilac: #9d96b2;
--color-heirloom-lilac-50: #f6f3ff;
--color-heirloom-lilac-100: #e9e5f4;
--color-heirloom-lilac-200: #d6d1e4;
--color-heirloom-lilac-300: #bab3ca;
--color-heirloom-lilac-400: #a09ab5;
--color-heirloom-lilac-500: #89819f;
--color-heirloom-lilac-600: #746d86;
--color-heirloom-lilac-700: #5c576c;
--color-heirloom-lilac-800: #43404f;
--color-heirloom-lilac-900: #2e2c37;
--color-heirloom-lilac-950: #1b1922;
}SCSS
$heirloom-lilac: #9d96b2;
$heirloom-lilac-rgb: 157, 150, 178;
$heirloom-lilac-light: mix(#fff, $heirloom-lilac, 20%);
$heirloom-lilac-dark: mix(#000, $heirloom-lilac, 20%);
.element {
color: $heirloom-lilac;
box-shadow: 0 0 0 2px rgba($heirloom-lilac, 0.35);
}