色名 · #966FD6
Iridescent Purple
Iridescent Purpleは#966FD6：rgb(150 111 214)、hsl(263 56% 64%)、oklch(0.625 0.154 299.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Iridescent Purple color name →
#966FD6
oklch(0.625 0.154 299.4)
カラー変換
- HEX
- #966fd6
- RGB
- rgb(150 111 214)
- HSL
- hsl(263 56% 64%)
- HWB
- hwb(263 44% 16%)
- OKLCH
- oklch(0.625 0.154 299.4)
- OKLab
- oklab(0.625 0.075 -0.134)
- CIE Lab
- lab(54.3 32.14 -48.02)
- LCH
- lch(54.3 57.79 303.8)
- CMYK
- cmyk(30% 48% 0% 16%)
ティント · シェード · トーン
ティント
- A07EDB
- AA8CE0
- B49BE4
- BEA9E9
- C8B7ED
- D3C5F1
- DED4F5
- E9E2F8
- F4F1FC
シェード
- 8260BA
- 6E519E
- 5B4284
- 49346A
- 372752
- 261A3B
- 160E25
- 080410
- 010102
トーン
- 9472CE
- 9174C5
- 8F76BD
- 8D78B4
- 8A7AAC
- 887BA3
- 867D9B
- 847E92
- 827F89
カラーハーモニー
補色 +180°
- 966FD6
Iridescent Purple
- 7E9300
≈ Mossy Woods
類似色 -30° +30°
- 966FD6
Iridescent Purple
- 6380E4
≈ Soft Blue
- B961B4
≈ Mazzy Star
トライアド +120° +240°
- 966FD6
Iridescent Purple
- C76E00
≈ Sludge
- 009E8A
≈ Flamboyant Teal
スプリットコンプリメンタリー +150° +210°
- 966FD6
Iridescent Purple
- A68300
≈ Golden Palm
- 2EA051
≈ Full Energy
テトラード +90° +180° +270°
- 966FD6
Iridescent Purple
- D45D4E
≈ Flame Stitch
- 7E9300
≈ Mossy Woods
- 0099AB
≈ Aquarium Diver
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.78:1 · APCA Lc 65
Ag
AA黒の上
WCAG 5.54:1 · APCA Lc 36
最適な文字色: #000000
WCAG 5.54:1 (AA) · APCA Lc 36
Contrast pairs
コードスニペット
CSS
:root {
--iridescent-purple: #966fd6;
--iridescent-purple-rgb: 150 111 214;
--iridescent-purple-oklch: oklch(0.625 0.154 299.4);
}
.element {
color: var(--iridescent-purple);
background-color: hsl(263 56% 64%);
border-color: oklch(0.625 0.154 299.4);
}Tailwind CSS v4
@theme {
--color-iridescent-purple: #966fd6;
--color-iridescent-purple-50: #fdecff;
--color-iridescent-purple-100: #f1ddff;
--color-iridescent-purple-200: #e0c5ff;
--color-iridescent-purple-300: #c5a4f9;
--color-iridescent-purple-400: #ac88eb;
--color-iridescent-purple-500: #966adc;
--color-iridescent-purple-600: #7f5ab9;
--color-iridescent-purple-700: #664895;
--color-iridescent-purple-800: #493470;
--color-iridescent-purple-900: #33244f;
--color-iridescent-purple-950: #1f1235;
}SCSS
$iridescent-purple: #966fd6;
$iridescent-purple-rgb: 150, 111, 214;
$iridescent-purple-light: mix(#fff, $iridescent-purple, 20%);
$iridescent-purple-dark: mix(#000, $iridescent-purple, 20%);
.element {
color: $iridescent-purple;
box-shadow: 0 0 0 2px rgba($iridescent-purple, 0.35);
}