色名 · #CC2266
Sensitive Scorpion
Sensitive Scorpionは#CC2266：rgb(204 34 102)、hsl(336 71% 47%)、oklch(0.558 0.205 3.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Sensitive Scorpion color name →
#CC2266
oklch(0.558 0.205 3.9)
カラー変換
- HEX
- #cc2266
- RGB
- rgb(204 34 102)
- HSL
- hsl(336 71% 47%)
- HWB
- hwb(336 13% 20%)
- OKLCH
- oklch(0.558 0.205 3.9)
- OKLab
- oklab(0.558 0.205 0.014)
- CIE Lab
- lab(46.16 66.47 6.62)
- LCH
- lch(46.16 66.8 5.7)
- CMYK
- cmyk(0% 83% 50% 20%)
ティント · シェード · トーン
ティント
- D44374
- DC5B83
- E37291
- E987A0
- EF9BAF
- F4AFBF
- F8C3CF
- FBD7DF
- FDEBEF
シェード
- B11C58
- 97164A
- 7E113C
- 650B2F
- 4E0723
- 370317
- 22010C
- 0F0004
- 020000
トーン
- C63569
- C0426B
- BA4D6E
- B35670
- AC5E73
- A46676
- 9C6D78
- 94747B
- 8A7A7D
カラーハーモニー
補色 +180°
- CC2266
Sensitive Scorpion
- 00867A
≈ Mystic Turquoise
類似色 -30° +30°
- CC2266
Sensitive Scorpion
- B533A4
≈ San Francisco Pink
- CF2F00
≈ Pleasant Pomegranate
トライアド +120° +240°
- CC2266
Sensitive Scorpion
- 638000
≈ Enchanted Forest
- 007ABD
≈ Deep Cerulean
スプリットコンプリメンタリー +150° +210°
- CC2266
Sensitive Scorpion
- 008B4B
≈ Real Turquoise
- 008297
≈ Cruising
テトラード +90° +180° +270°
- CC2266
Sensitive Scorpion
- 8A7200
≈ Vermin Brown
- 00867A
≈ Mystic Turquoise
- 535FE9
≈ Arcane Brew
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 5.26:1 · APCA Lc 74
Ag
Fail黒の上
WCAG 3.98:1 · APCA Lc 27
最適な文字色: #FFFFFF
WCAG 5.26:1 (AA) · APCA Lc 74
Contrast pairs
コードスニペット
CSS
:root {
--sensitive-scorpion: #cc2266;
--sensitive-scorpion-rgb: 204 34 102;
--sensitive-scorpion-oklch: oklch(0.558 0.205 3.9);
}
.element {
color: var(--sensitive-scorpion);
background-color: hsl(336 71% 47%);
border-color: oklch(0.558 0.205 3.9);
}Tailwind CSS v4
@theme {
--color-sensitive-scorpion: #cc2266;
--color-sensitive-scorpion-50: #ffddec;
--color-sensitive-scorpion-100: #ffcbdd;
--color-sensitive-scorpion-200: #ffaec7;
--color-sensitive-scorpion-300: #ff86a7;
--color-sensitive-scorpion-400: #fc5e91;
--color-sensitive-scorpion-500: #ea2b77;
--color-sensitive-scorpion-600: #c62865;
--color-sensitive-scorpion-700: #9f2150;
--color-sensitive-scorpion-800: #76153d;
--color-sensitive-scorpion-900: #540e2a;
--color-sensitive-scorpion-950: #380117;
}SCSS
$sensitive-scorpion: #cc2266;
$sensitive-scorpion-rgb: 204, 34, 102;
$sensitive-scorpion-light: mix(#fff, $sensitive-scorpion, 20%);
$sensitive-scorpion-dark: mix(#000, $sensitive-scorpion, 20%);
.element {
color: $sensitive-scorpion;
box-shadow: 0 0 0 2px rgba($sensitive-scorpion, 0.35);
}