色名 · #5E5587
Wool Violet
Wool Violetは#5E5587：rgb(94 85 135)、hsl(251 23% 43%)、oklch(0.48 0.08 291.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Wool Violet color name →
#5E5587
oklch(0.48 0.08 291.4)
カラー変換
- HEX
- #5e5587
- RGB
- rgb(94 85 135)
- HSL
- hsl(251 23% 43%)
- HWB
- hwb(251 33% 47%)
- OKLCH
- oklch(0.48 0.08 291.4)
- OKLab
- oklab(0.48 0.029 -0.074)
- CIE Lab
- lab(38.68 12.89 -26.88)
- LCH
- lch(38.68 29.81 295.6)
- CMYK
- cmyk(30% 37% 0% 47%)
ティント · シェード · トーン
ティント
- 6C6593
- 7B759F
- 8B85AB
- 9A96B7
- AAA7C3
- BBB8CF
- CBC9DB
- DCDBE7
- EEEDF3
シェード
- 514975
- 443D63
- 373151
- 2B2641
- 1F1C31
- 141121
- 0A0813
- 030206
- 000001
トーン
- 615987
- 645E86
- 686286
- 6B6785
- 6E6B84
- 726F84
- 757383
- 797882
- 7C7C81
カラーハーモニー
補色 +180°
- 5E5587
Wool Violet
- 5F6228
≈ Gardener Green
類似色 -30° +30°
- 5E5587
Wool Violet
- 445D8B
≈ Anchor Point
- 724E79
≈ Cabbage Blossom Violet
トライアド +120° +240°
- 5E5587
Wool Violet
- 815032
≈ Brazilian Brown
- 226C58
≈ Sparkling Emerald
スプリットコンプリメンタリー +150° +210°
- 5E5587
Wool Violet
- 745822
≈ Moss Brown
- 43693E
≈ Friendly Fairway
テトラード +90° +180° +270°
- 5E5587
Wool Violet
- 854A49
≈ Red Maple Leaf
- 5F6228
≈ Gardener Green
- 086B70
≈ Deep Lake
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.71:1 · APCA Lc 83
Ag
Fail黒の上
WCAG 3.12:1 · APCA Lc 19
最適な文字色: #FFFFFF
WCAG 6.71:1 (AA) · APCA Lc 83
Contrast pairs
コードスニペット
CSS
:root {
--wool-violet: #5e5587;
--wool-violet-rgb: 94 85 135;
--wool-violet-oklch: oklch(0.48 0.08 291.4);
}
.element {
color: var(--wool-violet);
background-color: hsl(251 23% 43%);
border-color: oklch(0.48 0.08 291.4);
}Tailwind CSS v4
@theme {
--color-wool-violet: #5e5587;
--color-wool-violet-50: #f6f1ff;
--color-wool-violet-100: #e8e3ff;
--color-wool-violet-200: #d5cef4;
--color-wool-violet-300: #b9b0dd;
--color-wool-violet-400: #9e96ca;
--color-wool-violet-500: #867db7;
--color-wool-violet-600: #726a9b;
--color-wool-violet-700: #5b547c;
--color-wool-violet-800: #413e5c;
--color-wool-violet-900: #2d2a41;
--color-wool-violet-950: #1a1829;
}SCSS
$wool-violet: #5e5587;
$wool-violet-rgb: 94, 85, 135;
$wool-violet-light: mix(#fff, $wool-violet, 20%);
$wool-violet-dark: mix(#000, $wool-violet, 20%);
.element {
color: $wool-violet;
box-shadow: 0 0 0 2px rgba($wool-violet, 0.35);
}