Couleur nommée la plus proche · #A6BAFF
#A6BAFF
Couleur nommée la plus proche: Pastel Blue
#A6BAFF (rgb(166 186 255), hsl(227 100% 83%), oklch(0.799 0.101 271.5)) est la plus proche de la couleur nommée Pastel Blue. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#A6BAFF
oklch(0.799 0.101 271.5)
Conversions de couleur
- HEX
- #a6baff
- RGB
- rgb(166 186 255)
- HSL
- hsl(227 100% 83%)
- HWB
- hwb(227 65% 0%)
- OKLCH
- oklch(0.799 0.101 271.5)
- OKLab
- oklab(0.799 0.003 -0.101)
- CIE Lab
- lab(75.91 5.1 -36.73)
- LCH
- lch(75.91 37.08 277.9)
- CMYK
- cmyk(35% 27% 0% 0%)
Teintes · Ombres · Tons
Teintes
- AFC1FF
- B7C8FF
- C0CFFF
- C9D6FF
- D2DDFF
- DAE4FF
- E4EAFF
- EDF1FF
- F6F8FF
Ombres
- 90A1DE
- 7A89BE
- 65729E
- 515C80
- 3E4663
- 2B3248
- 1A1E2E
- 0A0D16
- 010203
Tons
- A2B4F2
- 9EAEE5
- 9AA9D8
- 97A3CB
- 939DBE
- 8F97B2
- 8B91A5
- 878C99
- 84868C
Harmonies de couleurs
Complémentaire +180°
- A6BAFF
Pastel Blue
- D5BC6F
≈ Tookie Bird
Analogue -30° +30°
- A6BAFF
Pastel Blue
- 81C6F9
≈ Nevermind Nirvana
- C9AEF4
≈ Teasel Dipsacus
Triadique +120° +240°
- A6BAFF
Pastel Blue
- F7A595
≈ Au Contraire
- 8CD09D
≈ Fennel
Complémentaire divisée +150° +210°
- A6BAFF
Pastel Blue
- EDAF79
≈ Exciting Orange
- B3C87E
≈ Sour Face
Tétradique +90° +180° +270°
- A6BAFF
Pastel Blue
- F4A2B9
≈ Pink Chalk
- D5BC6F
≈ Tookie Bird
- 6BD3C2
≈ Downy
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.89:1 · APCA Lc 36
Ag
AAASur noir
WCAG 11.08:1 · APCA Lc 67
Meilleure couleur de texte: #000000
WCAG 11.08:1 (AAA) · APCA Lc 67
Contrast pairs
Extraits de code
CSS
:root {
--pastel-blue: #a6baff;
--pastel-blue-rgb: 166 186 255;
--pastel-blue-oklch: oklch(0.799 0.101 271.5);
}
.element {
color: var(--pastel-blue);
background-color: hsl(227 100% 83%);
border-color: oklch(0.799 0.101 271.5);
}Tailwind CSS v4
@theme {
--color-pastel-blue: #a6baff;
--color-pastel-blue-50: #ebf4ff;
--color-pastel-blue-100: #dde6ff;
--color-pastel-blue-200: #c6d2ff;
--color-pastel-blue-300: #a7b4ec;
--color-pastel-blue-400: #899bda;
--color-pastel-blue-500: #6e81c9;
--color-pastel-blue-600: #5d6eaa;
--color-pastel-blue-700: #4b5888;
--color-pastel-blue-800: #344065;
--color-pastel-blue-900: #242c47;
--color-pastel-blue-950: #13192e;
}SCSS
$pastel-blue: #a6baff;
$pastel-blue-rgb: 166, 186, 255;
$pastel-blue-light: mix(#fff, $pastel-blue, 20%);
$pastel-blue-dark: mix(#000, $pastel-blue, 20%);
.element {
color: $pastel-blue;
box-shadow: 0 0 0 2px rgba($pastel-blue, 0.35);
}