CSS not loading: common causes and simple fixes
When a local website looks like plain text, the design is usually not gone. The browser simply cannot find the CSS file.
The problem
CSS often lives in folders such as css, assets or dist. If only the HTML file is sent, relative paths break. Case sensitivity, leading slashes and using a source project instead of a built export are also common causes.
Simple solution
- Open the complete website folder or ZIP, not just one HTML file.
- Check link tags with rel="stylesheet" and compare paths with the folder structure.
- Match file names exactly, including case.
- If you received a package.json project, ask for the finished build folder.
- Use the local report to identify missing files.
Common mistakes
- Sending index.html without assets/style.css.
- Using paths from a developer machine.
- Expecting CSS from a Vite, React or Next.js source project before build.
- Renaming files after export without updating HTML links.
Checklist
- Complete export folder
- CSS files included
- Relative paths correct
- No local machine paths
- Right start page opened
- Mobile view checked after CSS loads
FAQ
Why does my HTML file have no design?
The browser can read the HTML, but it cannot find the linked stylesheet.
Can SitePreviewKit repair CSS?
It can surface missing files and path hints. The project or export still needs to be fixed.
Are absolute paths bad?
For handoffs, relative paths are usually more portable.