256 Tools

Color Format Converter

Values
HEX#3498DB
RGB52, 152, 219
HSL204, 70%, 53%
HSV204, 76%, 86%
CMYK76, 31, 0, 14
Code snippets
CSS hex#3498db
CSS rgb()rgb(52, 152, 219)
CSS hsl()hsl(204, 70%, 53%)
SwiftUIColor(red: 0.204, green: 0.596, blue: 0.859)
Android XML<color name="color">#3498DB</color>
FlutterColor(0xFF3498DB)

Related external sites

Some links are affiliate links.

Adobe ColorA free online tool for creating and exploring color palettes and themes. Use the color wheel to build harmonious schemes, or extract colors from an uploaded image. Palettes sync directly to Creative Cloud.CanvaA popular drag-and-drop design platform for creating social media posts, presentations, posters, and more. Offers a massive library of free and premium templates, photos, and graphics. No design experience needed to get started.

Related tools

Color ConverterConvert any color between HEX, RGB, HSL, HSV and RGBA at once. Edit any value, copy with one click, with alpha and WCAG contrast.Color Palette GeneratorGenerate harmonious color palettes from a base HEX using complementary, analogous, triadic and more schemes. Lock colors, reshuffle the rest, and export to CSS variables, Tailwind or JSON.Image Color ExtractorExtract the dominant color palette from any image in your browser — no upload. Get HEX, RGB and share % of each color, choose how many colors, copy or export as CSS/JSON.CSS Unit ConverterConvert between px, rem, em, pt and % for CSS, with adjustable root and base font sizes — in your browser.

Paste a color in HEX, RGB, or HSL and this converter shows it in every common format — HEX, RGB, HSL, HSV, and CMYK — and generates copy-ready code for CSS, SwiftUI, Android, and Flutter. It's aimed at developers who need the same color in another syntax. Everything runs in your browser.

How to use

  1. Paste a color as HEX, rgb() or hsl().
  2. Read the values in each format from the live preview.
  3. Copy the snippet for the platform you're working in.

How it works

The input is parsed into red, green, and blue components, whatever syntax you used. From those values the tool computes the other models: HSL and HSV describe hue, saturation and lightness/value, while CMYK is the print-oriented cyan-magenta-yellow-black model. Each platform snippet is then written in that language's exact syntax, so you can paste it straight into your code.

One color shown as HEX, RGB, HSL, HSV and CMYK values.→HEX RGB HSLHSV CMYKCSS / Swift…

Features

Five color models

See HEX, RGB, HSL, HSV and CMYK for any color at once.

Copy-ready code

Get CSS, SwiftUI, Android XML and Flutter snippets.

Flexible input

Accepts HEX (3 or 6 digits), rgb() and hsl() syntax.

Private & instant

All conversion runs in your browser; nothing is uploaded.

When to use it

Web development

Switch a color between hex, rgb() and hsl() for CSS.

Mobile apps

Get the right color literal for SwiftUI, Android or Flutter.

Print

Read the CMYK breakdown for print-oriented work.

Design to code

Translate a design color into the exact code you need.

Notes

  • HSV is also called HSB in some design tools.
  • CMYK here is a simple conversion, not a color-managed profile.
  • Android and Flutter snippets assume a fully opaque color.
  • All conversion runs on your device; nothing is uploaded.

FAQ

What input formats are accepted?
HEX (3 or 6 digits, with or without #), rgb()/rgba(), and hsl()/hsla() syntax.
What's the difference from a basic color converter?
This tool focuses on developer output — ready-to-paste code for CSS, SwiftUI, Android and Flutter, plus HSV and CMYK.
Is the CMYK accurate for printing?
It's a standard mathematical conversion. For exact print output, use a color-managed profile from your print provider.
What is HSV?
Hue, Saturation, Value — a model some design tools call HSB. It's handy for picking and adjusting colors.
Is my color uploaded?
No. Everything is converted in your browser and nothing leaves your device.

We use cookies for ads and analytics.