CSS Validator

Validate CSS in the browser — catch missing semicolons, unknown properties, and vendor prefixes.

CSS Input

Real-time

2 errors found

2 errors, 0 warnings

Line 2

Missing semicolon: "display: inline-flex"

Line 15

Missing semicolon: "background-color: #0077ed"

100%

Free, no
sign-up needed

Code written
by hand

85+

CSS tools
in one place

<1s

Copy-ready
CSS instantly

What is this

What is the CSS Validator?

Validate CSS syntax and catch errors before they reach production. Identifies invalid properties, missing values, and syntax mistakes.

Everything runs locally in your browser. Adjust the controls above, preview instantly, and copy clean, production-ready CSS — no account, no upload.

How to use

Using the CSS Validator

Everything lives in the panel at the top of this page. There is nothing to install — it all runs right here in your browser.

Paste your CSS

Paste a CSS snippet or full stylesheet into the input panel.

Validate

Click Validate or use the real-time validation toggle. Errors and warnings are listed with line numbers.

Fix and re-validate

Click on an error to highlight the affected line. Fix the issue and re-validate.

The output

What the generated code looks like

Clean, production-ready CSS — no vendor bloat, no unnecessary declarations.

valid.css

/* Common validation errors caught by the validator */

/* Error: Unknown property */
.element { colour: red; } /* "colour" is not a valid CSS property */

/* Error: Invalid value */
.element { display: inline-block block; } /* display cannot have two values */

/* Error: Missing semicolon */
.element {
  margin: 0
  padding: 10px; /* missing semicolon after margin causes parse failure */
}

/* Valid */
.element {
  color: red;
  display: inline-block;
  margin: 0;
  padding: 10px;
}

Pro tips

Pro tips for better results

★

Validation catches typos that browsers silently ignore

Browsers skip unknown properties silently. A typo like backround: #fff causes no error in DevTools but the property is simply not applied. A validator catches these immediately.

FAQ

Frequently asked questions

CSS variable declarations (--my-var: value) are always valid syntax. Usage of var(--my-var) is syntax-valid regardless of whether the variable is defined. The validator checks syntax, not whether variables resolve to valid values at runtime.

Errors are invalid syntax that will definitely be ignored by the browser. Warnings are valid syntax that may be unintentional or have compatibility concerns (e.g., using a property not yet supported in all browsers).