No title

How this works: Tincture is entirely offline — every conversion and palette is computed right in your browser, with no network requests at all, even after the page loads.
#
0%
0%
Formats
Hex
RGB
HSL
CMYK
Palette scheme

About Tincture

Tincture is a color picker, format converter, and palette generator in one page. Pick or type a color, read it off in hex, RGB, HSL, and CMYK, and build a matching palette from it — all computed locally, nothing ever leaves your browser.

Features

  • Hex, RGB, HSL, and CMYK shown and kept in sync
  • H/S/L sliders and a native color wheel picker
  • Nearest CSS color name, always shown
  • WCAG contrast ratio against black and white text
  • Eight palette schemes generated from your base color
  • One-tap copy on every value and every swatch
  • Export a palette as ready-to-use CSS custom properties
  • Fully offline — works with no internet connection

How to use it

  1. Pick a color with the swatch, type a hex code, or drag the H/S/L sliders.
  2. Copy whichever format you need — hex, RGB, HSL, or CMYK — with one tap.
  3. Check the contrast chips to see if the color is readable as text on white or black.
  4. Choose a palette scheme to generate matching colors from your base.
  5. Tap a swatch to copy its hex, or "Use" to make it the new base color.
  6. Export the whole palette as CSS variables when you're ready to use it.

Frequently asked questions

What's the difference between the palette schemes?

Complementary pairs a color with its opposite on the color wheel. Analogous picks neighbors for a calmer look. Triadic and tetradic space colors evenly around the wheel for more contrast. Monochromatic, shades, and tints stay within one hue at different lightness levels.

What does the contrast chip mean?

It's the WCAG contrast ratio between your color and white or black text. AA needs at least 4.5:1 for normal text; AAA needs 7:1. A failing ratio means that text pairing would be hard to read.

Is the nearest color name exact?

It's the closest match from the standard CSS named colors by numeric distance, not necessarily an exact hit — useful as a quick label, not a precise identity.

Can I paste a color from somewhere else?

Yes — type or paste any 3 or 6-digit hex code, with or without the #, into the hex field and the rest of the tool updates from it.

Does this store or send my colors anywhere?

No. There's no server involved at any point — everything is calculated in your browser and forgotten when you close the page.

Post a Comment

Previous Next

نموذج الاتصال