mvp.css is a simple, just good enough, stylesheet of basic modern design elements. Pair it with semantic html (apparently that’s still a thing). At thats it. No build step. No javascript.
It’s something any of us could have written and published in the last 5-10 years. But we didn’t. Or at least none of them came across my radar.
I’ve used it on a number of projects now, public and private. It’s perfect. It does what it says on the tin — and you can customise it if you need. The real beauty is that you don’t need to customise much.
For the obvious customisations it uses css variables. Did you know they have decent modern browser support. I did. But i still ignored them. I really shouldn’t have. They’re great.
For the bigger customisations, either do it inline on the element (if its a one-off), or add a new rule.
Having spent the last 5+ years deep in the React world, it’s so tempting and limiting to built a sizable react app for everything. Now, some things do warrant a full app. The main things I tend to get paid for should be React apps. The client demands the functionality, and the user expects it.
But not everything needs that. And not everything needs the baggage of the Javascript ecosystem. And thats coming from someone with very little in the way of animosity to Javascript and it’s ecosystem. I’ve written Typescript almost exclusively for a almost that whole time, which may play a part. There was a brief foray with Flow. Hands up if you know what a Flow is.
Where was I?
So I’ve got all these little projects, and it’s nice for them to have a website where they can explain themselves. But I really can’t build and maintain anything more than a single HTML page without wanting to ignore the entire thing.
There’s two sites currently where I’m using mvp.css publically retort.dev and projects.owenkelly.com.au
They took such a small amount of time to create. It’s tempting to want to do everything in this manner. But I think it bears caution that what makes mvp.css useful, is its simplicity. It’s not perfect, not at all. Its limiting. Theres’s not that many different elements. Don’t add more.
Because it’s styling semantic HTML, it’s very easy to loose the connection between the elements, how to nest them, and how they will look. And I think thats why none of us really did this before. It’s too easy to extend and build a monster.
It’s called mvp.css because it’s just that. Good enough for now.
For some of my projects “now” may be the next decade, and thats cool.