Technical
TechnicalInfo

Inline CSS

Checks for inline <style> blocks and style attributes — affects CSP and caching.

What this check measures

We count inline `<style>` elements and style="..." attribute usage. Excessive inline CSS prevents caching of styles across pages and complicates strict CSP.

Why it matters

Inline CSS is fine for critical-path styles (above-the-fold). Excessive inline CSS means styles re-download on every page vs. being cached once. Also blocks strict CSP without unsafe-inline.

search

How our audit detects it

Count inline <style> tags and style= attribute occurrences. Flag pages with more than ~3 inline styles or >50 style attributes.

Typical findings

  • error_outlineTailwind JIT spits out inline style for every utility class (edge cases only).
  • error_outlineLegacy CSS-in-JS runtime still shipping styles inline.

How to fix

Move non-critical styles to external .css files. Keep critical-path CSS (above-the-fold) inline for fast first paint. Use CSS modules or Tailwind's extract mode.

Frequently asked questions

Is critical CSS inline bad?expand_more
No — it is actually a performance technique. The issue is excessive inline CSS that should be external.

Want this checked on your site?

Pantra runs the full audit (SEO, Security, GEO, Performance, Schema, Technical, Images) in 10 seconds and generates stack-specific fix prompts.

Scan my site

Related checks