OKLCH Studio
Poprawki kontrastu dla popularnych par kolorów
Kontrast WCAG 2.2 i APCA dla kolorów Tailwind i CSS na bieli, czerni i neutralnych tłach, każdy z dostępną poprawką.
Na white (#FFFFFF)
- amber-400
- amber-500
- amber-600
- amber-700
- amber-800
- amber-900
- amber-950
- blue-300
- blue-400
- blue-500
- blue-600
- blue-700
- blue-800
- blue-900
- blue-950
- cyan-400
- cyan-500
- cyan-600
- cyan-700
- cyan-800
- cyan-900
- cyan-950
- emerald-300
- emerald-400
- emerald-500
- emerald-600
- emerald-700
- emerald-800
- emerald-900
- emerald-950
- fuchsia-300
- fuchsia-400
- fuchsia-500
- fuchsia-600
- fuchsia-700
- fuchsia-800
- fuchsia-900
- fuchsia-950
- gray-400
- gray-500
- gray-600
- gray-700
- gray-800
- gray-900
- gray-950
- green-400
- green-500
- green-600
- green-700
- green-800
- green-900
- green-950
- indigo-300
- indigo-400
- indigo-500
- indigo-600
- indigo-700
- indigo-800
- indigo-900
- indigo-950
- lime-400
- lime-500
- lime-600
- lime-700
- lime-800
- lime-900
- lime-950
- mauve-300
- mauve-400
- mauve-500
- mauve-600
- mauve-700
- mauve-800
- mauve-900
- mauve-950
- mist-400
- mist-500
- mist-600
- mist-700
- mist-800
- mist-900
- mist-950
- neutral-400
- neutral-500
- neutral-600
- neutral-700
- neutral-800
- neutral-900
- neutral-950
- olive-400
- olive-500
- olive-600
- olive-700
- olive-800
- olive-900
- olive-950
- orange-300
- orange-400
- orange-500
- orange-600
- orange-700
- orange-800
- orange-900
- orange-950
- pink-300
- pink-400
- pink-500
- pink-600
- pink-700
- pink-800
- pink-900
- pink-950
- purple-300
- purple-400
- purple-500
- purple-600
- purple-700
- purple-800
- purple-900
- purple-950
- red-300
- red-400
- red-500
- red-600
- red-700
- red-800
- red-900
- red-950
- rose-300
- rose-400
- rose-500
- rose-600
- rose-700
- rose-800
- rose-900
- rose-950
- sky-300
- sky-400
- sky-500
- sky-600
- sky-700
- sky-800
- sky-900
- sky-950
- slate-400
- slate-500
- slate-600
- slate-700
- slate-800
- slate-900
- slate-950
- stone-400
- stone-500
- stone-600
- stone-700
- stone-800
- stone-900
- stone-950
- taupe-400
- taupe-500
- taupe-600
- taupe-700
- taupe-800
- taupe-900
- teal-400
- teal-500
- teal-600
- teal-700
- teal-800
- teal-900
- teal-950
- violet-300
- violet-400
- violet-500
- violet-600
- violet-700
- violet-800
- violet-900
- violet-950
- yellow-400
- yellow-500
- yellow-600
- yellow-700
- yellow-800
- yellow-900
- yellow-950
- zinc-400
- zinc-500
- zinc-600
- zinc-700
- zinc-800
- zinc-900
- zinc-950
- black
- blue
- blueviolet
- brown
- burlywood
- cadetblue
- chocolate
- coral
- cornflowerblue
- crimson
- darkblue
- darkcyan
- darkgoldenrod
- darkgray
- darkgreen
- darkkhaki
- darkmagenta
- darkolivegreen
- darkorange
- darkorchid
- darkred
- darksalmon
- darkseagreen
- darkslateblue
- darkslategray
- darkturquoise
- darkviolet
- deeppink
- deepskyblue
- dimgray
- dodgerblue
- firebrick
- forestgreen
- fuchsia
- goldenrod
- gray
- green
- hotpink
- indianred
- indigo
- lightblue
- lightcoral
- lightpink
- lightsalmon
- lightseagreen
- lightskyblue
- lightslategray
- lightsteelblue
- limegreen
- maroon
- mediumaquamarine
- mediumblue
- mediumorchid
- mediumpurple
- mediumseagreen
- mediumslateblue
- mediumturquoise
- mediumvioletred
- midnightblue
- navy
- olive
- olivedrab
- orange
- orangered
- orchid
- palevioletred
- peru
- pink
- plum
- purple
- rebeccapurple
- red
- rosybrown
- royalblue
- saddlebrown
- salmon
- sandybrown
- seagreen
- sienna
- silver
- skyblue
- slateblue
- slategray
- steelblue
- tan
- teal
- thistle
- tomato
- turquoise
- violet
- yellowgreen
Na black (#000000)
- amber-50
- amber-100
- amber-200
- amber-300
- amber-400
- amber-500
- amber-600
- amber-700
- amber-800
- amber-900
- blue-50
- blue-100
- blue-200
- blue-300
- blue-400
- blue-500
- blue-600
- blue-700
- blue-800
- blue-900
- cyan-50
- cyan-100
- cyan-200
- cyan-300
- cyan-400
- cyan-500
- cyan-600
- cyan-700
- cyan-800
- cyan-900
- cyan-950
- emerald-50
- emerald-100
- emerald-200
- emerald-300
- emerald-400
- emerald-500
- emerald-600
- emerald-700
- emerald-800
- emerald-900
- fuchsia-50
- fuchsia-100
- fuchsia-200
- fuchsia-300
- fuchsia-400
- fuchsia-500
- fuchsia-600
- fuchsia-700
- fuchsia-800
- fuchsia-900
- gray-50
- gray-100
- gray-200
- gray-300
- gray-400
- gray-500
- gray-600
- gray-700
- green-50
- green-100
- green-200
- green-300
- green-400
- green-500
- green-600
- green-700
- green-800
- green-900
- indigo-50
- indigo-100
- indigo-200
- indigo-300
- indigo-400
- indigo-500
- indigo-600
- indigo-700
- indigo-800
- indigo-900
- lime-50
- lime-100
- lime-200
- lime-300
- lime-400
- lime-500
- lime-600
- lime-700
- lime-800
- lime-900
- mauve-50
- mauve-100
- mauve-200
- mauve-300
- mauve-400
- mauve-500
- mauve-600
- mauve-700
- mist-50
- mist-100
- mist-200
- mist-300
- mist-400
- mist-500
- mist-600
- mist-700
- neutral-100
- neutral-200
- neutral-300
- neutral-400
- neutral-500
- neutral-600
- neutral-700
- olive-50
- olive-100
- olive-200
- olive-300
- olive-400
- olive-500
- olive-600
- olive-700
- orange-50
- orange-100
- orange-200
- orange-300
- orange-400
- orange-500
- orange-600
- orange-700
- orange-800
- orange-900
- pink-50
- pink-100
- pink-200
- pink-300
- pink-400
- pink-500
- pink-600
- pink-700
- pink-800
- pink-900
- purple-50
- purple-100
- purple-200
- purple-300
- purple-400
- purple-500
- purple-600
- purple-700
- purple-800
- purple-900
- red-50
- red-100
- red-200
- red-300
- red-400
- red-500
- red-600
- red-700
- red-800
- red-900
- rose-50
- rose-100
- rose-200
- rose-300
- rose-400
- rose-500
- rose-600
- rose-700
- rose-800
- rose-900
- sky-50
- sky-100
- sky-200
- sky-300
- sky-400
- sky-500
- sky-600
- sky-700
- sky-800
- sky-900
- sky-950
- slate-50
- slate-100
- slate-200
- slate-300
- slate-400
- slate-500
- slate-600
- slate-700
- stone-50
- stone-100
- stone-200
- stone-300
- stone-400
- stone-500
- stone-600
- stone-700
- taupe-50
- taupe-100
- taupe-200
- taupe-300
- taupe-400
- taupe-500
- taupe-600
- taupe-700
- teal-50
- teal-100
- teal-200
- teal-300
- teal-400
- teal-500
- teal-600
- teal-700
- teal-800
- teal-900
- violet-50
- violet-100
- violet-200
- violet-300
- violet-400
- violet-500
- violet-600
- violet-700
- violet-800
- violet-900
- yellow-50
- yellow-100
- yellow-200
- yellow-300
- yellow-400
- yellow-500
- yellow-600
- yellow-700
- yellow-800
- yellow-900
- zinc-100
- zinc-200
- zinc-300
- zinc-400
- zinc-500
- zinc-600
- zinc-700
- aliceblue
- antiquewhite
- aqua
- aquamarine
- azure
- beige
- bisque
- blanchedalmond
- blue
- blueviolet
- brown
- burlywood
- cadetblue
- chartreuse
- chocolate
- coral
- cornflowerblue
- cornsilk
- crimson
- darkcyan
- darkgoldenrod
- darkgray
- darkgreen
- darkkhaki
- darkmagenta
- darkolivegreen
- darkorange
- darkorchid
- darkred
- darksalmon
- darkseagreen
- darkslateblue
- darkslategray
- darkturquoise
- darkviolet
- deeppink
- deepskyblue
- dimgray
- dodgerblue
- firebrick
- floralwhite
- forestgreen
- fuchsia
- gainsboro
- ghostwhite
- gold
- goldenrod
- gray
- green
- greenyellow
- honeydew
- hotpink
- indianred
- indigo
- ivory
- khaki
- lavender
- lavenderblush
- lawngreen
- lemonchiffon
- lightblue
- lightcoral
- lightcyan
- lightgoldenrodyellow
- lightgray
- lightgreen
- lightpink
- lightsalmon
- lightseagreen
- lightskyblue
- lightslategray
- lightsteelblue
- lightyellow
- lime
- limegreen
- linen
- maroon
- mediumaquamarine
- mediumblue
- mediumorchid
- mediumpurple
- mediumseagreen
- mediumslateblue
- mediumspringgreen
- mediumturquoise
- mediumvioletred
- mintcream
- mistyrose
- moccasin
- navajowhite
- oldlace
- olive
- olivedrab
- orange
- orangered
- orchid
- palegoldenrod
- palegreen
- paleturquoise
- palevioletred
- papayawhip
- peachpuff
- peru
- pink
- plum
- powderblue
- purple
- rebeccapurple
- red
- rosybrown
- royalblue
- saddlebrown
- salmon
- sandybrown
- seagreen
- seashell
- sienna
- silver
- skyblue
- slateblue
- slategray
- snow
- springgreen
- steelblue
- tan
- teal
- thistle
- tomato
- turquoise
- violet
- wheat
- white
- yellow
- yellowgreen
Na gray-50 (#F9FAFB)
Na gray-100 (#F3F4F6)
Na gray-200 (#E5E7EB)
Na gray-800 (#1E2939)
Na gray-900 (#101828)
Na gray-950 (#030712)
Na #f5f5f5 (#F5F5F5)
Na #eeeeee (#EEEEEE)
Na #333333 (#333333)
Na #222222 (#222222)
Na #121212 (#121212)
Na Kolory Tailwind CSS / Nazwane kolory CSS
- white na amber-400
- white na amber-500
- white na amber-600
- black na amber-600
- white na amber-700
- black na amber-700
- black na amber-800
- black na amber-900
- white na blue-300
- white na blue-400
- white na blue-500
- black na blue-500
- white na blue-600
- black na blue-600
- white na blue-700
- black na blue-700
- black na blue-800
- black na blue-900
- white na cyan-400
- white na cyan-500
- white na cyan-600
- black na cyan-600
- white na cyan-700
- black na cyan-700
- black na cyan-800
- black na cyan-900
- black na cyan-950
- white na emerald-300
- white na emerald-400
- white na emerald-500
- white na emerald-600
- black na emerald-600
- white na emerald-700
- black na emerald-700
- black na emerald-800
- black na emerald-900
- white na fuchsia-300
- white na fuchsia-400
- white na fuchsia-500
- black na fuchsia-500
- white na fuchsia-600
- black na fuchsia-600
- white na fuchsia-700
- black na fuchsia-700
- black na fuchsia-800
- black na fuchsia-900
- white na gray-400
- white na gray-500
- black na gray-500
- black na gray-600
- black na gray-700
- white na green-400
- white na green-500
- white na green-600
- black na green-600
- white na green-700
- black na green-700
- black na green-800
- black na green-900
- white na indigo-300
- white na indigo-400
- black na indigo-400
- white na indigo-500
- black na indigo-500
- white na indigo-600
- black na indigo-600
- black na indigo-700
- black na indigo-800
- black na indigo-900
- white na lime-400
- white na lime-500
- white na lime-600
- black na lime-600
- white na lime-700
- black na lime-700
- black na lime-800
- black na lime-900
- white na mauve-300
- white na mauve-400
- white na mauve-500
- black na mauve-500
- black na mauve-600
- black na mauve-700
- white na mist-400
- white na mist-500
- black na mist-500
- black na mist-600
- black na mist-700
- white na neutral-400
- white na neutral-500
- black na neutral-500
- black na neutral-600
- black na neutral-700
- white na olive-400
- white na olive-500
- black na olive-500
- white na olive-600
- black na olive-600
- black na olive-700
- white na orange-300
- white na orange-400
- white na orange-500
- white na orange-600
- black na orange-600
- white na orange-700
- black na orange-700
- black na orange-800
- black na orange-900
- white na pink-300
- white na pink-400
- white na pink-500
- black na pink-500
- white na pink-600
- black na pink-600
- white na pink-700
- black na pink-700
- black na pink-800
- black na pink-900
- white na purple-300
- white na purple-400
- white na purple-500
- black na purple-500
- white na purple-600
- black na purple-600
- black na purple-700
- black na purple-800
- black na purple-900
- white na red-300
- white na red-400
- white na red-500
- black na red-500
- white na red-600
- black na red-600
- white na red-700
- black na red-700
- black na red-800
- black na red-900
- white na rose-300
- white na rose-400
- white na rose-500
- black na rose-500
- white na rose-600
- black na rose-600
- white na rose-700
- black na rose-700
- black na rose-800
- black na rose-900
- white na sky-300
- white na sky-400
- white na sky-500
- white na sky-600
- black na sky-600
- white na sky-700
- black na sky-700
- black na sky-800
- black na sky-900
- black na sky-950
- white na slate-400
- white na slate-500
- black na slate-500
- black na slate-600
- black na slate-700
- white na stone-400
- white na stone-500
- black na stone-500
- black na stone-600
- black na stone-700
- white na taupe-400
- white na taupe-500
- black na taupe-500
- black na taupe-600
- black na taupe-700
- white na teal-400
- white na teal-500
- white na teal-600
- black na teal-600
- white na teal-700
- black na teal-700
- black na teal-800
- black na teal-900
- white na violet-300
- white na violet-400
- white na violet-500
- black na violet-500
- white na violet-600
- black na violet-600
- black na violet-700
- black na violet-800
- black na violet-900
- white na yellow-400
- white na yellow-500
- white na yellow-600
- white na yellow-700
- black na yellow-700
- white na yellow-800
- black na yellow-800
- black na yellow-900
- white na zinc-400
- white na zinc-500
- black na zinc-500
- black na zinc-600
- black na zinc-700
- black na blue
- white na blueviolet
- black na blueviolet
- black na brown
- white na burlywood
- white na cadetblue
- black na cadetblue
- white na chocolate
- black na chocolate
- white na coral
- white na cornflowerblue
- white na crimson
- black na crimson
- white na darkcyan
- black na darkcyan
- white na darkgoldenrod
- black na darkgoldenrod
- white na darkgray
- black na darkgreen
- white na darkkhaki
- black na darkmagenta
- white na darkolivegreen
- black na darkolivegreen
- white na darkorange
- white na darkorchid
- black na darkorchid
- black na darkred
- white na darksalmon
- white na darkseagreen
- black na darkslateblue
- black na darkslategray
- white na darkturquoise
- white na darkviolet
- black na darkviolet
- white na deeppink
- black na deeppink
- white na deepskyblue
- white na dimgray
- black na dimgray
- white na dodgerblue
- black na dodgerblue
- white na firebrick
- black na firebrick
- white na forestgreen
- black na forestgreen
- white na fuchsia
- black na fuchsia
- white na goldenrod
- white na gray
- black na gray
- white na green
- black na green
- white na hotpink
- white na indianred
- black na indianred
- black na indigo
- white na lightblue
- white na lightcoral
- white na lightpink
- white na lightsalmon
- white na lightseagreen
- white na lightskyblue
- white na lightslategray
- black na lightslategray
- white na lightsteelblue
- white na limegreen
- black na maroon
- white na mediumaquamarine
- black na mediumblue
- white na mediumorchid
- black na mediumorchid
- white na mediumpurple
- black na mediumpurple
- white na mediumseagreen
- white na mediumslateblue
- black na mediumslateblue
- white na mediumturquoise
- white na mediumvioletred
- black na mediumvioletred
- white na olive
- black na olive
- white na olivedrab
- black na olivedrab
- white na orange
- white na orangered
- black na orangered
- white na orchid
- white na palevioletred
- black na palevioletred
- white na peru
- white na pink
- white na plum
- black na purple
- black na rebeccapurple
- white na red
- black na red
- white na rosybrown
- white na royalblue
- black na royalblue
- black na saddlebrown
- white na salmon
- white na sandybrown
- white na seagreen
- black na seagreen
- white na sienna
- black na sienna
- white na silver
- white na skyblue
- white na slateblue
- black na slateblue
- white na slategray
- black na slategray
- white na steelblue
- black na steelblue
- white na tan
- white na teal
- black na teal
- white na thistle
- white na tomato
- white na turquoise
- white na violet
- white na yellowgreen