色名 · #FF8656
Nectarine
Nectarineは#FF8656：rgb(255 134 86)、hsl(17 100% 67%)、oklch(0.746 0.16 41.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Nectarine color name →
#FF8656
oklch(0.746 0.16 41.7)
カラー変換
- HEX
- #ff8656
- RGB
- rgb(255 134 86)
- HSL
- hsl(17 100% 67%)
- HWB
- hwb(17 34% 0%)
- OKLCH
- oklch(0.746 0.16 41.7)
- OKLab
- oklab(0.746 0.12 0.106)
- CIE Lab
- lab(69.4 44.32 47.12)
- LCH
- lch(69.4 64.69 46.8)
- CMYK
- cmyk(0% 47% 66% 0%)
ティント · シェード · トーン
ティント
- FF9369
- FFA07A
- FFAC8B
- FFB89C
- FFC5AD
- FFD0BD
- FFDCCD
- FFE8DE
- FFF3EE
シェード
- DE744A
- BE623E
- 9E5132
- 804027
- 63301C
- 482112
- 2E1308
- 160602
- 030100
トーン
- F3865C
- E68762
- DA8767
- CD866B
- C1866F
- B48573
- A88477
- 9B837A
- 8D827D
カラーハーモニー
補色 +180°
- FF8656
Nectarine
- 00BFEA
≈ Blue Raspberry
類似色 -30° +30°
- FF8656
Nectarine
- FF7E93
≈ Magical Girl
- EA9900
≈ Pumpkin Yellow
トライアド +120° +240°
- FF8656
Nectarine
- 1ACB8C
≈ Retro Lime
- 9FA1FF
≈ Cobalite
スプリットコンプリメンタリー +150° +210°
- FF8656
Nectarine
- 00C6C1
≈ Swimmers Pool
- 69B1FF
≈ Tiān Lán Sky
テトラード +90° +180° +270°
- FF8656
Nectarine
- 87C14C
≈ Citrus Surge
- 00BFEA
≈ Blue Raspberry
- CE8DF6
≈ Liliac
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.38:1 · APCA Lc 47
Ag
AAA黒の上
WCAG 8.79:1 · APCA Lc 55
最適な文字色: #000000
WCAG 8.79:1 (AAA) · APCA Lc 55
Contrast pairs
コードスニペット
CSS
:root {
--nectarine: #ff8656;
--nectarine-rgb: 255 134 86;
--nectarine-oklch: oklch(0.746 0.16 41.7);
}
.element {
color: var(--nectarine);
background-color: hsl(17 100% 67%);
border-color: oklch(0.746 0.16 41.7);
}Tailwind CSS v4
@theme {
--color-nectarine: #ff8656;
--color-nectarine-50: #ffe7d1;
--color-nectarine-100: #ffd7bd;
--color-nectarine-200: #ffbe9c;
--color-nectarine-300: #fb9b72;
--color-nectarine-400: #eb7a4d;
--color-nectarine-500: #d9581b;
--color-nectarine-600: #b74b1a;
--color-nectarine-700: #933c15;
--color-nectarine-800: #6e2a10;
--color-nectarine-900: #4e1c0a;
--color-nectarine-950: #330c01;
}SCSS
$nectarine: #ff8656;
$nectarine-rgb: 255, 134, 86;
$nectarine-light: mix(#fff, $nectarine, 20%);
$nectarine-dark: mix(#000, $nectarine, 20%);
.element {
color: $nectarine;
box-shadow: 0 0 0 2px rgba($nectarine, 0.35);
}