restraint-meter
Most "designy" portfolios use seven greys and four typefaces and call it
taste. Restraint is a discipline. Drop a .css file (or paste
it) and get a single number out of 100 — plus the sorted list of what to
delete first.
drop a .css file here or paste the contents below
—
/ 100
metriccountbudgetover
first things to delete
the manifesto (and the rubric)
This isn't a lint rule. It's an opinion with a number attached. You start at 100. Every excess subtracts. The budgets are deliberately tight — if you disagree, that's the point. Argue with the rubric, not the score.
- colors — budget
8.−2per extra unique color. Greys count.currentColordoesn't. - fonts — budget
2(one display, one body — or just one).−5per extra family. - animations — budget
3(@keyframes+animation:uses combined).−1per extra. - !important — budget
0.−5each. There is no good reason. Fix specificity. - z-index values — budget
4.−2per extra unique value. If you have 18, you have a stacking-context problem. - media queries — budget
4unique breakpoints.−1per extra. Pick three. Live with them.
Score floor is 0. Anything 90+ is monastic.
70–89 is healthy. 50–69 is the average
portfolio. Below 50, you're decorating.