Frontend and CSS tools
Colours, gradients, shadows, units and build output for web developers.
11 tools
- Color ConverterConvert colors between HEX, RGB, HSL and OKLCH with alpha
- CSS Unit ConverterConvert between px, rem, em, %, vw, vh, pt and physical units
- Contrast CheckerWCAG contrast ratio and AA/AAA pass/fail for text and UI colors
- Color PaletteGenerate a 50–950 shade scale and color harmonies from one color; export CSS variables or Tailwind
- CSS GradientBuild or parse linear, radial and conic gradients with live preview
- Border RadiusPer-corner and elliptical border-radius builder with shortest shorthand
- Box ShadowLayered box-shadow generator and parser with live preview
- Build InspectorUpload or paste a Vite manifest, webpack stats, Next.js build manifest or file list to see sizes, source maps and unhashed files, and compare two builds
- Real User MetricsPaste or upload web-vitals samples or a CrUX export to see p75 with enough samples and a split by device, browser, region, viewport and route
- CSS → TailwindSuggest Tailwind utility classes for CSS declarations, in your browser
- Palette from ImagePick an image to get its 5–12 dominant colors with shares, names and text contrast; copy them as CSS or Tailwind