最も近い色名 · #9A93D3
#9A93D3
最も近い色名: Easter Egg
#9A93D3（rgb(154 147 211)、hsl(247 42% 70%)、oklch(0.693 0.093 288.7)）に最も近い色名はEaster Eggです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#9A93D3
oklch(0.693 0.093 288.7)
カラー変換
- HEX
- #9a93d3
- RGB
- rgb(154 147 211)
- HSL
- hsl(247 42% 70%)
- HWB
- hwb(247 58% 17%)
- OKLCH
- oklch(0.693 0.093 288.7)
- OKLab
- oklab(0.693 0.03 -0.088)
- CIE Lab
- lab(63.39 13.27 -32.14)
- LCH
- lch(63.39 34.77 292.4)
- CMYK
- cmyk(27% 30% 0% 17%)
ティント · シェード · トーン
ティント
- A39ED8
- ADA8DC
- B7B3E1
- C1BEE6
- CBC8EA
- D5D3EE
- DFDEF3
- EAE9F7
- F4F4FB
シェード
- 857FB7
- 716C9C
- 5E5982
- 4B4769
- 393651
- 27253A
- 171624
- 090810
- 010102
トーン
- 9791CB
- 9590C2
- 928EBA
- 8F8CB2
- 8D8AA9
- 8A88A1
- 878699
- 858491
- 828288
カラーハーモニー
補色 +180°
- 9A93D3
Easter Egg
- A1A15B
≈ Gothic Revival Green
類似色 -30° +30°
- 9A93D3
Easter Egg
- 799ED6
≈ Ice Blue
- B58AC2
≈ Creeping Bellflower
トライアド +120° +240°
- 9A93D3
Easter Egg
- CC8B68
≈ Escalope
- 5CAF92
≈ O’grady Green
スプリットコンプリメンタリー +150° +210°
- 9A93D3
Easter Egg
- BC9557
≈ Maple Syrup
- 7FAB72
≈ Sage Garden
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.80:1 · APCA Lc 54
Ag
AAA黒の上
WCAG 7.48:1 · APCA Lc 48
最適な文字色: #000000
WCAG 7.48:1 (AAA) · APCA Lc 48
Contrast pairs
コードスニペット
CSS
:root {
--easter-egg: #9a93d3;
--easter-egg-rgb: 154 147 211;
--easter-egg-oklch: oklch(0.693 0.093 288.7);
}
.element {
color: var(--easter-egg);
background-color: hsl(247 42% 70%);
border-color: oklch(0.693 0.093 288.7);
}Tailwind CSS v4
@theme {
--color-easter-egg: #9a93d3;
--color-easter-egg-50: #f4f1ff;
--color-easter-egg-100: #e7e3ff;
--color-easter-egg-200: #d3cefa;
--color-easter-egg-300: #b7b0e4;
--color-easter-egg-400: #9c96d3;
--color-easter-egg-500: #847bc0;
--color-easter-egg-600: #7069a2;
--color-easter-egg-700: #595482;
--color-easter-egg-800: #403d61;
--color-easter-egg-900: #2c2a44;
--color-easter-egg-950: #19172c;
}SCSS
$easter-egg: #9a93d3;
$easter-egg-rgb: 154, 147, 211;
$easter-egg-light: mix(#fff, $easter-egg, 20%);
$easter-egg-dark: mix(#000, $easter-egg, 20%);
.element {
color: $easter-egg;
box-shadow: 0 0 0 2px rgba($easter-egg, 0.35);
}