Color Converter
Pick a color or paste a HEX code to instantly convert between HEX, RGB, HSL, HSV and CMYK. Click any value to copy.
How to Use the Color Converter in 3 Steps
- Pick a color from the picker or paste a HEX, RGB or HSL code.
- See it converted instantly to every format with a live color preview.
- Click any value to copy it to your clipboard.
Frequently Asked Questions
Is it free?
Yes, completely free with no limits and no cost. Convert as many colors as you want between HEX, RGB, HSL and CMYK, as often as you like. No credits, no signup, no premium tier — every conversion feature is free for everyone, forever.
Do I need to sign up?
No signup needed — ever. Just open the page and convert colors instantly: no account to create, no email address required, no trial period. The converter runs entirely in your browser the moment the page loads, with zero setup required.
Is my data/code private?
Yes, 100% private. Color conversion happens entirely in your browser — nothing you type or pick is sent to any server, stored, or tracked. There is no data to leak; it's just simple, fast math running locally on your device.
What is the difference between HEX, RGB and HSL?
HEX (#1F5EFF) is the compact code used in CSS and design tools. RGB (31, 94, 255) defines a color by red, green and blue light amounts from 0–255. HSL (221°, 100%, 62%) describes hue, saturation and lightness — the most intuitive for adjusting colors, since you tweak one slider-like value at a time.
Can I pick a color visually?
Yes. Use the built-in color picker to choose any shade visually, then see its HEX, RGB, HSL and CMYK values update instantly with a live preview swatch. You can also paste any existing code to start from a known color.
How do I copy a converted value?
Click any converted value — HEX, RGB, HSL or CMYK — and it's copied to your clipboard instantly. Paste it straight into your CSS file, design tool, or code editor. No manual text selection and no formatting cleanup needed afterward.
Related Tools
function hx(n){n=Math.max(0,Math.min(255,Math.round(n)));var h=n.toString(16);return h.length===1?"0"+h:h;} function hexToRgb(h){h=h.replace("#","");if(h.length===3)h=h.split("").map(function(c){return c+c;}).join("");var v=parseInt(h,16);return{v:v,r:(v>>16)&255,g:(v>>8)&255,b:v&255};} function rgbToHsl(r,g,b){r/=255;g/=255;b/=255;var mx=Math.max(r,g,b),mn=Math.min(r,g,b),h=0,s=0,l=(mx+mn)/2;if(mx!==mn){var d=mx-mn;s=l>0.5?d/(2-mx-mn):d/(mx+mn);if(mx===r)h=(g-b)/d+(g\x3cb style='font-size:13px'>"+label+"\x3c/b>\x3ccode style='font-size:14px'>"+val+"\x3c/code>\x3c/div>";} function copyVal(el){try{navigator.clipboard.writeText(el.getAttribute("data-v"));}catch(e){}el.style.borderColor="var(--green)";setTimeout(function(){el.style.borderColor="";},600);} function update(hex){ hex=hex.trim();if(hex.charAt(0)!=="#")hex="#"+hex; if(!/^#[0-9a-fA-F]{3}([0-9a-fA-F]{3})?$/.test(hex))return; var o=hexToRgb(hex),hsl=rgbToHsl(o.r,o.g,o.b),hsv=rgbToHsv(o.r,o.g,o.b),cmyk=rgbToCmyk(o.r,o.g,o.b); var full="#"+hx(o.r)+hx(o.g)+hx(o.b); document.getElementById("swatch").style.background=full; document.getElementById("cout").innerHTML= row("HEX",full)+row("RGB","rgb("+o.r+", "+o.g+", "+o.b+")")+row("HSL","hsl("+hsl.h+", "+hsl.s+"%, "+hsl.l+"%)")+row("HSV","hsv("+hsv.h+", "+hsv.s+"%, "+hsv.v+"%)")+row("CMYK","cmyk("+cmyk.c+"%, "+cmyk.m+"%, "+cmyk.y+"%, "+cmyk.k+"%)"); } document.getElementById("cpick").addEventListener("input",function(e){document.getElementById("chex").value=e.target.value;update(e.target.value);}); document.getElementById("chex").addEventListener("input",function(e){update(e.target.value);}); update("#1f5eff");