Color tools

Test any color pair against WCAG 2.2 and APCA in one view. Live preview, OKLCH-based fix suggestions, color blindness simulation.

Paste any color — hex, rgb, hsl, oklch, or a CSS name — and get every other format plus copy-ready code snippets for CSS, Tailwind, Swift, Android, Flutter.

보색, 유사색, 삼각, 사각, 분할 보색, 정사각형, 단색 조합으로 팔레트를 만드세요.

Build linear, radial, and conic CSS gradients with OKLCH interpolation. Compare side by side with sRGB to see the mud-zone disappear.

Build soft multi-color mesh gradients from draggable points. OKLCH-harmonized, export free PNG or copy pure CSS with no WebGL required.

Drop any photo and extract its dominant palette with k-means clustering in OKLab. 100% local — your images never leave your browser.

See a palette on a real UI mockup — nav, hero, cards, forms — with live WCAG contrast checks that flag unreadable combinations as you edit.

Reference for every default Tailwind v4 color. Search by name, copy HEX or OKLCH with one click, and read why v4 ships in OKLCH.

Build a 50→950 tonal scale from any color using OKLCH — perceptually uniform across hues, ready to drop into Tailwind v4 or CSS variables.

Mix two colors in sRGB, OKLab, or OKLCH — side by side, so the muddy sRGB midpoint is impossible to miss.

Test an entire palette against 8 forms of color vision deficiency at once — see whether your red, green, and amber collapse into a single color.

All 147 CSS named colors in one searchable, sortable grid. Click any swatch to copy, view by hue or lightness.

색상을 붙여넣고 약 300개 이름의 엄선된 사전에서 사람이 읽기 쉬운 가장 가까운 이름을 찾으세요.

소셜, 개발자, 스트리밍, 금융, 커머스, 생산성 브랜드의 출처 있는 색상 팔레트를 검색하세요.

파스텔, 비비드, 다크, 웜, 쿨 제약으로 랜덤 HEX 색상과 팔레트를 생성하세요.