Free CSS sample files
Stylesheets that control how web pages look. Download valid CSS test files in 4 exact sizes, from 1 KB to 1 MB, each with a checksum.
- Extension
- .css
- MIME type
- text/css
- Kind
- Text
- Category
- Code
CSS files by size
Every file below is a valid Cascading Style Sheets file of exactly the stated size. Open a file's page for its checksum and contents, and to preview it in your browser before downloading.
| File | Size | Contents | Download |
|---|---|---|---|
| 1 KB CSS samplesample-css-1kb.css | 1 KB1,024 bytes | Features: Custom properties, class selectors, rem and px units | Download CSS |
| 10 KB CSS samplesample-css-10kb.css | 10 KB10,240 bytes | Features: Custom properties, class selectors, rem and px units | Download CSS |
| 100 KB CSS samplesample-css-100kb.css | 100 KB102,400 bytes | Features: Custom properties, class selectors, rem and px units | Download CSS |
| 1 MB CSS samplesample-css-1mb.css | 1 MB1,048,576 bytes | Features: Custom properties, class selectors, rem and px units | Download CSS |
What is a CSS file?
CSS describes presentation: colours, spacing, layout and typography. A stylesheet is a list of rules, each pairing a selector, which chooses elements, with declarations that set properties.
Browsers ignore declarations they do not understand and carry on, which lets the language grow without breaking old pages.
How to recognise a CSS file
No signature bytes. CSS files are identified by parsing their content.
| Extension | .css |
|---|---|
| MIME type | text/css |
| Standard | W3C CSS, published as modules |
| Encoding | UTF-8 |
| Comments | /* */ |
| Error handling | Invalid declarations are skipped |
What to test for
These are the behaviours that most often go wrong when software handles CSS files.
- With X-Content-Type-Options: nosniff, browsers refuse a stylesheet that is not served as text/css.
Strengths of CSS
- Fault-tolerant: unknown rules are skipped rather than breaking the page.
- Compresses and caches extremely well.
Limitations of CSS
- The cascade makes large stylesheets hard to reason about.
- A stylesheet in the document head blocks rendering until it loads.
Typical uses of CSS test files
- Testing minifiers and bundlers
- Checking asset pipelines and caching
- Testing code editors and syntax highlighters
Software that opens CSS
- All web browsers
- PostCSS, Sass and Lightning CSS
- Stylelint and editors
Specifications
Related
CSS sample files: questions
- What do the sample stylesheets contain?
- Custom properties, a body rule and a long list of class rules, with no @import rules or external URLs.
- What is the MIME type of a CSS file?
- The MIME type is text/css. The file extension is .css.
- Is a sample CSS file the same as a dummy or example CSS file?
- Yes. Sample, test, dummy and example CSS files are different names for the same thing: a CSS file with known contents that stands in for a real one. Any file on this page will do wherever a tutorial or a test plan asks for a dummy CSS file.