Launching a SaaS?·Collect waitlist signups before you build — before.run
regex.to logoregex.to
SandboxPatternsDetectDocsChangelog
Web
#css
#color
#oklch
#web

CSS oklch() Color

Validates CSS oklch() color function values as defined in CSS Color Level 4. Supports lightness (0–1), chroma (0–0.4), hue (0–360), and optional alpha.

✓ CSS preprocessor validation✓ Design token linting✓ Color picker input parsing
/
/
Safe
Test String
5 matches
oo— 'o' — literal character
kk— 'k' — literal character
ll— 'l' — literal character
cc— 'c' — literal character
hh— 'h' — literal character
\(\(— \( — escaped character '('
\s*space— \s — whitespace (space, tab, newline…) — repeated zero or more times (greedy) · * — zero or more times (greedy)
(?:…)Non-capturing group— Non-capturing group — groups without capturing (no index assigned)
nn— 'n' — literal character
oo— 'o' — literal character
nn— 'n' — literal character
ee— 'e' — literal character
||— | — alternation: matches expression on left OR right
[…]*Character class […]— Matches any single character listed in this set — repeated zero or more times (greedy) · * — zero or more times (greedy)
\.?\.— \. — escaped character '.' — repeated zero or one time (optional) · ? — zero or one time (optional)
[…]+Character class […]— Matches any single character listed in this set — repeated one or more times (greedy) · + — one or more times (greedy)
%?%— '%' — literal character — repeated zero or one time (optional) · ? — zero or one time (optional)
\s+space— \s — whitespace (space, tab, newline…) — repeated one or more times (greedy) · + — one or more times (greedy)
(?:…)Non-capturing group— Non-capturing group — groups without capturing (no index assigned)
nn— 'n' — literal character
oo— 'o' — literal character
nn— 'n' — literal character
ee— 'e' — literal character
||— | — alternation: matches expression on left OR right
[…]*Character class […]— Matches any single character listed in this set — repeated zero or more times (greedy) · * — zero or more times (greedy)
\.?\.— \. — escaped character '.' — repeated zero or one time (optional) · ? — zero or one time (optional)
[…]+Character class […]— Matches any single character listed in this set — repeated one or more times (greedy) · + — one or more times (greedy)
\s+space— \s — whitespace (space, tab, newline…) — repeated one or more times (greedy) · + — one or more times (greedy)
(?:…)Non-capturing group— Non-capturing group — groups without capturing (no index assigned)
nn— 'n' — literal character
oo— 'o' — literal character
nn— 'n' — literal character
ee— 'e' — literal character
||— | — alternation: matches expression on left OR right
[…]*Character class […]— Matches any single character listed in this set — repeated zero or more times (greedy) · * — zero or more times (greedy)
\.?\.— \. — escaped character '.' — repeated zero or one time (optional) · ? — zero or one time (optional)
[…]+Character class […]— Matches any single character listed in this set — repeated one or more times (greedy) · + — one or more times (greedy)
(?:…)?Non-capturing group— Non-capturing group — groups without capturing (no index assigned) — repeated zero or one time (optional) · ? — zero or one time (optional)
(?:…)?Non-capturing group— Non-capturing group — groups without capturing (no index assigned) — repeated zero or one time (optional) · ? — zero or one time (optional)
\s*space— \s — whitespace (space, tab, newline…) — repeated zero or more times (greedy) · * — zero or more times (greedy)
\/\/— \/ — escaped character '/'
\s*space— \s — whitespace (space, tab, newline…) — repeated zero or more times (greedy) · * — zero or more times (greedy)
(?:…)Non-capturing group— Non-capturing group — groups without capturing (no index assigned)
\s*space— \s — whitespace (space, tab, newline…) — repeated zero or more times (greedy) · * — zero or more times (greedy)
\)\)— \) — escaped character ')'
Pattern: 137 charsInput: 102 chars
100% client-side · private

✓ Valid Examples

  • oklch(0.7 0.15 200)
  • oklch(70% 0.15 200deg)
  • oklch(0.5 0.2 120 / 0.8)
  • oklch(none 0 0)
  • oklch(1 0 0 / 50%)

✗ Invalid Examples

  • oklch()
  • oklch(0.7 0.15)
  • rgb(255 0 0)
  • oklch(1.5 0.2 120)

Usage & Integration

Validate CSS oklch() Color natively in your backend or frontend without copying regex strings.

Node / Edge

import { validate } from '@regexto/validators';

validate('color-oklch', '...');

Python

from regexto_validators import validate

validate("color-oklch", "...")

Go

import "github.com/regex-to/validators-go"

valid, err := validators.Validate("color-oklch", "...")

PHP

use RegexTo\Validators\Validator;

Validator::validate('color-oklch', '...');

Rust

use regexto_validators::validate;

let is_valid = validate("color-oklch", "...").unwrap();