色名 · #673E6E
Majesty
Majestyは#673E6E：rgb(103 62 110)、hsl(291 28% 34%)、oklch(0.432 0.091 321.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Majesty color name →
#673E6E
oklch(0.432 0.091 321.6)
カラー変換
- HEX
- #673e6e
- RGB
- rgb(103 62 110)
- HSL
- hsl(291 28% 34%)
- HWB
- hwb(291 24% 57%)
- OKLCH
- oklch(0.432 0.091 321.6)
- OKLab
- oklab(0.432 0.071 -0.057)
- CIE Lab
- lab(32.74 24.84 -20.53)
- LCH
- lch(32.74 32.23 320.4)
- CMYK
- cmyk(6% 44% 0% 57%)
ティント · シェード · トーン
ティント
- 76507C
- 84628A
- 937498
- A287A6
- B19AB5
- C0AEC3
- D0C2D2
- DFD6E1
- EFEAF0
シェード
- 59355F
- 4B2B50
- 3D2341
- 301A33
- 231226
- 170A19
- 0C040E
- 040104
- 000001
トーン
- 6A4570
- 6C4C72
- 6F5274
- 725976
- 745F78
- 776679
- 796C7B
- 7B737D
- 7E797E
カラーハーモニー
補色 +180°
- 673E6E
Majesty
- 315C2B
≈ Pine
類似色 -30° +30°
- 673E6E
Majesty
- 51467E
≈ Fresh Eggplant
- 753956
≈ Passionate Plum
トライアド +120° +240°
- 673E6E
Majesty
- 694A00
≈ Antique Bronze
- 005C61
≈ Enamelled Jewel
スプリットコンプリメンタリー +150° +210°
- 673E6E
Majesty
- 525509
≈ Douro
- 005F4A
≈ Sci-Fi Takeout
テトラード +90° +180° +270°
- 673E6E
Majesty
- 77401B
≈ Walnut
- 315C2B
≈ Pine
- 005878
≈ Broadway
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 8.43:1 · APCA Lc 89
Ag
Fail黒の上
WCAG 2.49:1 · APCA Lc 13
最適な文字色: #FFFFFF
WCAG 8.43:1 (AAA) · APCA Lc 89
Contrast pairs
コードスニペット
CSS
:root {
--majesty: #673e6e;
--majesty-rgb: 103 62 110;
--majesty-oklch: oklch(0.432 0.091 321.6);
}
.element {
color: var(--majesty);
background-color: hsl(291 28% 34%);
border-color: oklch(0.432 0.091 321.6);
}Tailwind CSS v4
@theme {
--color-majesty: #673e6e;
--color-majesty-50: #ffedff;
--color-majesty-100: #f8defa;
--color-majesty-200: #e8c8eb;
--color-majesty-300: #cfa8d2;
--color-majesty-400: #b88dbf;
--color-majesty-500: #a271aa;
--color-majesty-600: #896090;
--color-majesty-700: #6e4d73;
--color-majesty-800: #503856;
--color-majesty-900: #38263c;
--color-majesty-950: #221426;
}SCSS
$majesty: #673e6e;
$majesty-rgb: 103, 62, 110;
$majesty-light: mix(#fff, $majesty, 20%);
$majesty-dark: mix(#000, $majesty, 20%);
.element {
color: $majesty;
box-shadow: 0 0 0 2px rgba($majesty, 0.35);
}