色名 · #E83A72

Fantasy Romance

Fantasy Romanceは#E83A72：rgb(232 58 114)、hsl(341 79% 57%)、oklch(0.625 0.211 6.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Red mean? → · Fantasy Romance color name →

#E83A72

oklch(0.625 0.211 6.9)

カラー変換

HEX: #e83a72
RGB: rgb(232 58 114)
HSL: hsl(341 79% 57%)
HWB: hwb(341 23% 9%)
OKLCH: oklch(0.625 0.211 6.9)
OKLab: oklab(0.625 0.21 0.025)
CIE Lab: lab(54.03 68.6 11.23)
LCH: lch(54.03 69.51 9.3)
CMYK: cmyk(0% 75% 51% 9%)

ティント · シェード · トーン

ティント

ED547F
F26B8D
F67F9A
FA92A8
FDA5B6
FFB7C4
FFC9D3
FFDBE1
FFEDF0

シェード

CA3162
AC2853
902044
741836
591028
40091B
29040E
130104
030001

トーン

DF4773
D65175
CD5A76
C36178
B96879
AF6D7B
A4737C
99787D
8D7C7F

カラーハーモニー

補色 +180°

E83A72
Fantasy Romance
009D93
≈ Caribbean Turquoise

類似色 -30° +30°

トライアド +120° +240°

スプリットコンプリメンタリー +150° +210°

テトラード +90° +180° +270°

コントラストとアクセシビリティ

白の上

WCAG 3.97:1 · APCA Lc 66

Fail

黒の上

WCAG 5.27:1 · APCA Lc 36

最適な文字色: #000000

WCAG 5.27:1 (AA) · APCA Lc 36

Contrast pairs

コードスニペット

CSS

:root {
  --fantasy-romance: #e83a72;
  --fantasy-romance-rgb: 232 58 114;
  --fantasy-romance-oklch: oklch(0.625 0.211 6.9);
}

.element {
  color: var(--fantasy-romance);
  background-color: hsl(341 79% 57%);
  border-color: oklch(0.625 0.211 6.9);
}

Tailwind CSS v4

@theme {
  --color-fantasy-romance: #e83a72;
  --color-fantasy-romance-50: #ffdde9;
  --color-fantasy-romance-100: #ffcbd9;
  --color-fantasy-romance-200: #ffadc1;
  --color-fantasy-romance-300: #ff84a1;
  --color-fantasy-romance-400: #ff5b89;
  --color-fantasy-romance-500: #ee246e;
  --color-fantasy-romance-600: #c9235d;
  --color-fantasy-romance-700: #a21c4b;
  --color-fantasy-romance-800: #781239;
  --color-fantasy-romance-900: #550c27;
  --color-fantasy-romance-950: #390015;
}

SCSS

$fantasy-romance: #e83a72;
$fantasy-romance-rgb: 232, 58, 114;
$fantasy-romance-light: mix(#fff, $fantasy-romance, 20%);
$fantasy-romance-dark: mix(#000, $fantasy-romance, 20%);

.element {
  color: $fantasy-romance;
  box-shadow: 0 0 0 2px rgba($fantasy-romance, 0.35);
}

近い色名

Palettes with similar colors

ツールで開く

ピッカーペアコントラストチェッカー Studio JSON API