이름 색상 · #FF3344

Devil’s Advocate

Devil’s Advocate은(는) #FF3344: rgb(255 51 68), hsl(355 100% 60%), oklch(0.651 0.235 23.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Red mean? → · Devil’s Advocate color name →

#FF3344

oklch(0.651 0.235 23.2)

색상 변환

HEX: #ff3344
RGB: rgb(255 51 68)
HSL: hsl(355 100% 60%)
HWB: hwb(355 20% 0%)
OKLCH: oklch(0.651 0.235 23.2)
OKLab: oklab(0.651 0.216 0.093)
CIE Lab: lab(57.05 74.99 43.21)
LCH: lch(57.05 86.54 30)
CMYK: cmyk(0% 80% 73% 0%)

틴트 · 셰이드 · 톤

틴트

FF5358
FF6B6A
FF807D
FF948F
FFA7A2
FFB9B4
FFCBC7
FFDCD9
FFEEEC

셰이드

DE2B3A
BE2330
9E1C26
80141D
630D14
48070C
2E0305
160102
030000

톤

F4444C
E85053
DD5A59
D16260
C56966
B86F6B
AB7471
9E7976
8F7C7B

색 조화

보색 +180°

FF3344
Devil’s Advocate
00A3AD
≈ Aare River Brienz

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

사각 배색 +90° +180° +270°

대비 및 접근성

흰색 위

WCAG 3.61:1 · APCA Lc 62

Fail

검은색 위

WCAG 5.80:1 · APCA Lc 40

가장 좋은 글자색: #000000

WCAG 5.80:1 (AA) · APCA Lc 40

Contrast pairs

코드 스니펫

CSS

:root {
  --devil-s-advocate: #ff3344;
  --devil-s-advocate-rgb: 255 51 68;
  --devil-s-advocate-oklch: oklch(0.651 0.235 23.2);
}

.element {
  color: var(--devil-s-advocate);
  background-color: hsl(355 100% 60%);
  border-color: oklch(0.651 0.235 23.2);
}

Tailwind CSS v4

@theme {
  --color-devil-s-advocate: #ff3344;
  --color-devil-s-advocate-50: #ffdbd3;
  --color-devil-s-advocate-100: #ffc9c0;
  --color-devil-s-advocate-200: #ffaaa0;
  --color-devil-s-advocate-300: #ff7f77;
  --color-devil-s-advocate-400: #ff5158;
  --color-devil-s-advocate-500: #fc0030;
  --color-devil-s-advocate-600: #d5002a;
  --color-devil-s-advocate-700: #ac0321;
  --color-devil-s-advocate-800: #80001b;
  --color-devil-s-advocate-900: #5b0311;
  --color-devil-s-advocate-950: #3d0004;
}

SCSS

$devil-s-advocate: #ff3344;
$devil-s-advocate-rgb: 255, 51, 68;
$devil-s-advocate-light: mix(#fff, $devil-s-advocate, 20%);
$devil-s-advocate-dark: mix(#000, $devil-s-advocate, 20%);

.element {
  color: $devil-s-advocate;
  box-shadow: 0 0 0 2px rgba($devil-s-advocate, 0.35);
}

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

피커 조합 대비 검사기 Studio JSON API