Free tool - runs in your browser

Hex color regex tester

Test hex colors (#RGB, #RRGGBB, #RGBA and #RRGGBBAA, with or without the #, any case) and CSS rgb(), rgba() and hsl() values in comma or space syntax. Pick a preset, edit the regex and paste colors one per line: every match shows a swatch. Copy JavaScript, Python or an HTML pattern when you are ready.

Hex, rgb() and hsl() color patterns

Hex presets use the i flag, so upper and lower case both match. The rgb() presets limit each channel to 0-255, and the hsl() presets limit hue to 0-360 and saturation and lightness to 0%-100%. Alpha may be 0 to 1 or 0% to 100%. Default hex pattern: ^#([0-9a-f]{3}|[0-9a-f]{6})$. Every preset below is checked against its match and no-match samples.

Hex color pattern in an HTML form

<form action="https://splitforms.com/api/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_KEY">

  <label for="brand-color">Brand color (hex)</label>
  <input id="brand-color" name="brand_color" type="text" pattern="#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})" title="Hex color such as #ff4f00 or #fff" placeholder="#ff4f00" required>

  <label for="accent-color">Accent color</label>
  <input id="accent-color" name="accent_color" type="color" value="#ff4f00">

  <button type="submit">Send</button>
</form>

A text input can enforce a hex format with the pattern attribute. HTML anchors the whole value, uses the v flag and has no case-insensitive flag, so the pattern lists both a-f and A-F. Add required to reject an empty value. The form posts to splitforms, so each submitted color arrives in your inbox; check it again on your server before you save it.

A native input type=color ignores pattern and always gives a lowercase 7-character #rrggbb value, such as #ff4f00. It never sends #fff, uppercase letters, alpha, rgb() or hsl(). Use a text input with one of these presets when people need to type or paste other color formats.

Hex color regex FAQ