最も近い色名 · #745293
#745293
最も近い色名: Ninja Princess
#745293（rgb(116 82 147)、hsl(271 28% 45%)、oklch(0.502 0.107 307.1)）に最も近い色名はNinja Princessです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#745293
oklch(0.502 0.107 307.1)
カラー変換
- HEX
- #745293
- RGB
- rgb(116 82 147)
- HSL
- hsl(271 28% 45%)
- HWB
- hwb(271 32% 42%)
- OKLCH
- oklch(0.502 0.107 307.1)
- OKLab
- oklab(0.502 0.064 -0.085)
- CIE Lab
- lab(40.74 24.57 -30.7)
- LCH
- lch(40.74 39.32 308.7)
- CMYK
- cmyk(21% 44% 0% 42%)
ティント · シェード · トーン
ティント
- 81639E
- 8E73A9
- 9C84B4
- A995BE
- B7A6C9
- C5B7D4
- D3C9DF
- E2DBEA
- F0EDF4
シェード
- 64467F
- 543B6C
- 452F59
- 372547
- 291A36
- 1B1125
- 0F0816
- 050208
- 010001
トーン
- 755791
- 765C90
- 78618E
- 79658C
- 7A6A8B
- 7B6E89
- 7C7387
- 7E7785
- 7F7C82
カラーハーモニー
補色 +180°
- 745293
Ninja Princess
- 536F24
≈ Loren Forest
類似色 -30° +30°
- 745293
Ninja Princess
- 555DA0
≈ Purple Frenzy
- 8A4A7A
≈ Thistle Mauve
トライアド +120° +240°
- 745293
Ninja Princess
- 8C560C
≈ Caffeinated Cinnamon
- 00746C
≈ Hawk Turquoise
スプリットコンプリメンタリー +150° +210°
- 745293
Ninja Princess
- 756300
≈ Spicy Mustard
- 1E764B
≈ Felt
テトラード +90° +180° +270°
- 745293
Ninja Princess
- 964B35
≈ Arabian Spice
- 536F24
≈ Loren Forest
- 007085
≈ Amalfi
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.22:1 · APCA Lc 81
Ag
Fail黒の上
WCAG 3.37:1 · APCA Lc 21
最適な文字色: #FFFFFF
WCAG 6.22:1 (AA) · APCA Lc 81
Contrast pairs
コードスニペット
CSS
:root {
--ninja-princess: #745293;
--ninja-princess-rgb: 116 82 147;
--ninja-princess-oklch: oklch(0.502 0.107 307.1);
}
.element {
color: var(--ninja-princess);
background-color: hsl(271 28% 45%);
border-color: oklch(0.502 0.107 307.1);
}Tailwind CSS v4
@theme {
--color-ninja-princess: #745293;
--color-ninja-princess-50: #feedff;
--color-ninja-princess-100: #f2dfff;
--color-ninja-princess-200: #e2c8f7;
--color-ninja-princess-300: #c7a9e1;
--color-ninja-princess-400: #af8ed0;
--color-ninja-princess-500: #9972bd;
--color-ninja-princess-600: #8161a0;
--color-ninja-princess-700: #674d80;
--color-ninja-princess-800: #4b3860;
--color-ninja-princess-900: #342743;
--color-ninja-princess-950: #20152b;
}SCSS
$ninja-princess: #745293;
$ninja-princess-rgb: 116, 82, 147;
$ninja-princess-light: mix(#fff, $ninja-princess, 20%);
$ninja-princess-dark: mix(#000, $ninja-princess, 20%);
.element {
color: $ninja-princess;
box-shadow: 0 0 0 2px rgba($ninja-princess, 0.35);
}