Hex to CSS Filter, RGB & RGBA Converter

Convert any hex color code into CSS filter values, RGB, and RGBA instantly. Built for web designers and frontend developers who need to tint SVG icons or quickly translate between color formats.

Color code conversions

Generated CSS filter

Filter CSS:

About Color Kit

Color Kit is a free online tool for web designers and frontend developers. Beyond simple hex-to-RGB conversion, it generates a working CSS filter chain — using brightness, sepia, hue-rotate, saturate, and contrast — that recolors a black SVG or image into your target color without editing the source file.

How to use

  1. Type or paste a hex code (e.g. #1abc9c), RGB, or RGBA value.
  2. Click Get Color.
  3. Copy the result you need: hex, RGB, RGBA, or the CSS filter string.

Frequently asked questions

What is a CSS filter for SVG?

A CSS filter chain shifts a black SVG into any target color without changing its fill attribute. Color Kit calculates the chain so you can paste it straight into your stylesheet.

Is Color Kit free to use?

Yes. Color Kit is completely free and runs entirely in your browser — no data is sent to a server.

Which color formats are supported?

Hex (3 or 6 digit), RGB, and RGBA inputs. Outputs include hex, RGB, RGBA, and the CSS filter equivalent.