Adlandırılmış renk · #FD645F
Pineapple Salmon
Pineapple Salmon, #FD645F: rgb(253 100 95), hsl(2 98% 68%), oklch(0.698 0.188 25.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Red mean? → · Pineapple Salmon color name →
#FD645F
oklch(0.698 0.188 25.1)
Renk dönüşümleri
- HEX
- #fd645f
- RGB
- rgb(253 100 95)
- HSL
- hsl(2 98% 68%)
- HWB
- hwb(2 37% 1%)
- OKLCH
- oklch(0.698 0.188 25.1)
- OKLab
- oklab(0.698 0.17 0.08)
- CIE Lab
- lab(63.08 59.15 34.87)
- LCH
- lch(63.08 68.67 30.5)
- CMYK
- cmyk(0% 60% 62% 1%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- FF766F
- FF877F
- FF978F
- FFA79F
- FFB6AE
- FFC5BE
- FFD3CE
- FFE2DE
- FFF1EF
Koyu tonlar
- DC5652
- BC4844
- 9D3B38
- 7F2E2C
- 622220
- 471615
- 2D0B0A
- 160303
- 030000
Gri tonlar
- F16963
- E66E67
- DA726B
- CE756E
- C27872
- B57A75
- A97C78
- 9C7E7B
- 8E7F7D
Renk uyumları
Tamamlayıcı +180°
- FD645F
Pineapple Salmon
- 00B2C1
≈ Marrakech Mile
Analog -30° +30°
- FD645F
Pineapple Salmon
- F362A3
≈ Fugitive Flamingo
- EC7B00
≈ Pumpkin Cat
Üçlü +120° +240°
- FD645F
Pineapple Salmon
- 3CBB4B
≈ Vegan Mastermind
- 6D99FF
≈ Blue Chaos
Bölünmüş tamamlayıcı +150° +210°
- FD645F
Pineapple Salmon
- 00B899
≈ Aare River
- 00AAEC
≈ Vivid Cerulean
Dörtlü +90° +180° +270°
- FD645F
Pineapple Salmon
- 9BA800
≈ Barf Green
- 00B2C1
≈ Marrakech Mile
- A883FF
≈ Purple Illusionist
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.93:1 · APCA Lc 55
Ag
AAASiyah üzerinde
WCAG 7.16:1 · APCA Lc 47
En iyi metin rengi: #000000
WCAG 7.16:1 (AAA) · APCA Lc 47
Contrast pairs
Kod parçacıkları
CSS
:root {
--pineapple-salmon: #fd645f;
--pineapple-salmon-rgb: 253 100 95;
--pineapple-salmon-oklch: oklch(0.698 0.188 25.1);
}
.element {
color: var(--pineapple-salmon);
background-color: hsl(2 98% 68%);
border-color: oklch(0.698 0.188 25.1);
}Tailwind CSS v4
@theme {
--color-pineapple-salmon: #fd645f;
--color-pineapple-salmon-50: #ffe1d8;
--color-pineapple-salmon-100: #ffd0c6;
--color-pineapple-salmon-200: #ffb5a8;
--color-pineapple-salmon-300: #ff8e82;
--color-pineapple-salmon-400: #fa6963;
--color-pineapple-salmon-500: #e83e40;
--color-pineapple-salmon-600: #c43737;
--color-pineapple-salmon-700: #9e2c2c;
--color-pineapple-salmon-800: #761e21;
--color-pineapple-salmon-900: #531416;
--color-pineapple-salmon-950: #370407;
}SCSS
$pineapple-salmon: #fd645f;
$pineapple-salmon-rgb: 253, 100, 95;
$pineapple-salmon-light: mix(#fff, $pineapple-salmon, 20%);
$pineapple-salmon-dark: mix(#000, $pineapple-salmon, 20%);
.element {
color: $pineapple-salmon;
box-shadow: 0 0 0 2px rgba($pineapple-salmon, 0.35);
}