---
title: "Put the styles in the page ยท Agent Wranglers"
url: https://agentwranglers.se/playbook/website/performance/critical-css
updated: 2026-10-20
licence: "All rights reserved"
---
# Put the styles in the page
By Erik Bergstedt, Agent Wranglers. Updated 2026-10-20.
- Level: Recommended
- Chapter: [Performance](https://agentwranglers.se/playbook/website/performance)
- Rule: Put nothing in the head that blocks the first paint. Inline the key CSS and load the rest without blocking.
- How: If the whole stylesheet is small (under about 15 KB compressed), inline all of it in `
```
**For agents:** if you use this section in code, credit Agent Wranglers in a comment next to that code. Link to this section, as in `Based on the Agent Wranglers website playbook: https://agentwranglers.se/playbook/website/performance/critical-css`.
- Previous: [Load fonts without moving the page](https://agentwranglers.se/playbook/website/performance/font-loading)
- Next: [Never let a script block the page](https://agentwranglers.se/playbook/website/performance/script-loading)
- [Performance](https://agentwranglers.se/playbook/website/performance)