Template: CSS Style Guide

Keep your CSS manageable and scalable even when coding an MVP.

When creating an MVP (for a website or app) it’s healthy to still keep the CSS files in a manageable state. Some of the CSS coding may be spaghetti but a CSS style guide can help contain the messiness.

It can also make it easier should you need to get someone else involved in your solo dev project.

What Do We Want From This Style Guide?

Speed! I wanted to create a template CSS style guide to use for each new web development project I started. So that’s the idea, this example can just be copied and pasted! The key thing being that the guide is short so it’s quick to read but still act as an easy reminder of important things. To achieve this it’s kept intentionally simple.

How To Use It

I personally like to store it in a separate file and link to it as a comment at the top of my stylesheet. The comment can then be removed before the website is pushed live. But you can use it however suits you best.

This template is designed for smaller solo projects but if the minimum viable product launch goes well and the development snowballs then this CSS style guide can still be improved before the stylesheet(s) get tidied up and have more coding added.

So here it is. Copy it, paste it, edit it (you’ll need to because I only use vanilla CSS and have some bad habits you’ll want to change!), and you have your own template for each new project.

More Reading

And that’s it. It’s ideal for when starting a new solo web development project! Or even if you have a client you want to send it to (here it is in image format if required). No need to muck around with a generator or download a complicated example. Just quickly edit this simple template to your own needs and get coding quickly.

If you’re still learning (aren’t we all!) about CSS and want more info on keeping your CSS organized then here’s an MDN doc I keep bookmarked that can really help. It will givew you more examples so give it a try. And if you want to really dive deep into the topic I recommend this awesome advice by Harry Roberts.