色名 · #FBB719
Tropical Sun
Tropical Sunは#FBB719：rgb(251 183 25)、hsl(42 97% 54%)、oklch(0.821 0.166 80.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Tropical Sun color name →
#FBB719
oklch(0.821 0.166 80.8)
カラー変換
- HEX
- #fbb719
- RGB
- rgb(251 183 25)
- HSL
- hsl(42 97% 54%)
- HWB
- hwb(42 10% 2%)
- OKLCH
- oklch(0.821 0.166 80.8)
- OKLab
- oklab(0.821 0.027 0.163)
- CIE Lab
- lab(79.31 17.09 78.01)
- LCH
- lch(79.31 79.85 77.6)
- CMYK
- cmyk(0% 27% 90% 2%)
ティント · シェード · トーン
ティント
- FCBF46
- FDC662
- FDCE79
- FED58F
- FEDCA3
- FFE4B6
- FFEBC8
- FFF1DB
- FFF8ED
シェード
- DA9F14
- BA8710
- 9C700B
- 7E5A07
- 614504
- 463102
- 2D1E01
- 150C00
- 030200
トーン
- EEB236
- E2AD46
- D5A753
- C9A25C
- BC9C65
- B0976C
- A49172
- 988C77
- 8C867C
カラーハーモニー
補色 +180°
- FBB719
Tropical Sun
- A4C6FF
≈ Night Snow
類似色 -30° +30°
- FBB719
Tropical Sun
- FFAF81
≈ Sassy Peach
- CACD33
≈ Yellow-Green Grosbeak
トライアド +120° +240°
- FBB719
Tropical Sun
- 00DFE9
≈ Tamarama
- F0A3FF
≈ Rich Brilliant Lavender
スプリットコンプリメンタリー +150° +210°
- FBB719
Tropical Sun
- 72D2FF
≈ Heisenberg Blue
- C4BAFF
≈ Lavender Tonic
テトラード +90° +180° +270°
- FBB719
Tropical Sun
- 00E5B6
≈ Overchlorinated Pool
- A4C6FF
≈ Night Snow
- FFA4CE
≈ Bazooka Pink
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.76:1 · APCA Lc 32
Ag
AAA黒の上
WCAG 11.88:1 · APCA Lc 71
最適な文字色: #000000
WCAG 11.88:1 (AAA) · APCA Lc 71
Contrast pairs
コードスニペット
CSS
:root {
--tropical-sun: #fbb719;
--tropical-sun-rgb: 251 183 25;
--tropical-sun-oklch: oklch(0.821 0.166 80.8);
}
.element {
color: var(--tropical-sun);
background-color: hsl(42 97% 54%);
border-color: oklch(0.821 0.166 80.8);
}Tailwind CSS v4
@theme {
--color-tropical-sun: #fbb719;
--color-tropical-sun-50: #fff2c0;
--color-tropical-sun-100: #ffe4a8;
--color-tropical-sun-200: #f7ce7f;
--color-tropical-sun-300: #e1af46;
--color-tropical-sun-400: #d09100;
--color-tropical-sun-500: #bd7500;
--color-tropical-sun-600: #9f6300;
--color-tropical-sun-700: #804f00;
--color-tropical-sun-800: #603900;
--color-tropical-sun-900: #432700;
--color-tropical-sun-950: #2b1500;
}SCSS
$tropical-sun: #fbb719;
$tropical-sun-rgb: 251, 183, 25;
$tropical-sun-light: mix(#fff, $tropical-sun, 20%);
$tropical-sun-dark: mix(#000, $tropical-sun, 20%);
.element {
color: $tropical-sun;
box-shadow: 0 0 0 2px rgba($tropical-sun, 0.35);
}