色名 · #A09FCC
Indigo Child
Indigo Childは#A09FCC：rgb(160 159 204)、hsl(241 31% 71%)、oklch(0.719 0.065 285.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Indigo Child color name →
#A09FCC
oklch(0.719 0.065 285.7)
カラー変換
- HEX
- #a09fcc
- RGB
- rgb(160 159 204)
- HSL
- hsl(241 31% 71%)
- HWB
- hwb(241 62% 20%)
- OKLCH
- oklch(0.719 0.065 285.7)
- OKLab
- oklab(0.719 0.018 -0.063)
- CIE Lab
- lab(66.78 7.59 -23.04)
- LCH
- lch(66.78 24.26 288.2)
- CMYK
- cmyk(22% 22% 0% 20%)
ティント · シェード · トーン
ティント
- A9A8D1
- B2B2D6
- BBBBDC
- C5C5E1
- CECEE6
- D8D8EB
- E1E2F0
- EBEBF5
- F5F5FA
シェード
- 8B8AB1
- 767597
- 61617E
- 4E4D65
- 3B3B4E
- 292937
- 191822
- 09090F
- 010102
トーン
- 9D9CC4
- 9999BD
- 9696B5
- 9393AD
- 9090A6
- 8D8C9E
- 898997
- 86868F
- 838387
カラーハーモニー
補色 +180°
- A09FCC
Indigo Child
- AAA778
≈ Olive Tree
類似色 -30° +30°
- A09FCC
Indigo Child
- 8AA7CD
≈ Polo Blue
- B498C0
≈ Atlantic Tulip
トライアド +120° +240°
- A09FCC
Indigo Child
- C89882
≈ Beauty and the Beach
- 7DB29B
≈ Beau Monde
スプリットコンプリメンタリー +150° +210°
- A09FCC
Indigo Child
- BC9F77
≈ Almond Toast
- 93AE85
≈ Fair Green
テトラード +90° +180° +270°
- A09FCC
Indigo Child
- CA9497
≈ Minstrel Rose
- AAA778
≈ Olive Tree
- 72B1B1
≈ Aurora Teal
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.52:1 · APCA Lc 49
Ag
AAA黒の上
WCAG 8.32:1 · APCA Lc 52
最適な文字色: #000000
WCAG 8.32:1 (AAA) · APCA Lc 52
Contrast pairs
コードスニペット
CSS
:root {
--indigo-child: #a09fcc;
--indigo-child-rgb: 160 159 204;
--indigo-child-oklch: oklch(0.719 0.065 285.7);
}
.element {
color: var(--indigo-child);
background-color: hsl(241 31% 71%);
border-color: oklch(0.719 0.065 285.7);
}Tailwind CSS v4
@theme {
--color-indigo-child: #a09fcc;
--color-indigo-child-50: #f4f3ff;
--color-indigo-child-100: #e6e5fd;
--color-indigo-child-200: #d2d1ef;
--color-indigo-child-300: #b5b3d8;
--color-indigo-child-400: #9a99c4;
--color-indigo-child-500: #8280b0;
--color-indigo-child-600: #6e6d95;
--color-indigo-child-700: #585777;
--color-indigo-child-800: #3f4058;
--color-indigo-child-900: #2b2c3e;
--color-indigo-child-950: #191927;
}SCSS
$indigo-child: #a09fcc;
$indigo-child-rgb: 160, 159, 204;
$indigo-child-light: mix(#fff, $indigo-child, 20%);
$indigo-child-dark: mix(#000, $indigo-child, 20%);
.element {
color: $indigo-child;
box-shadow: 0 0 0 2px rgba($indigo-child, 0.35);
}