Type and color
Your typeface says more about your business than your logo, and yet eight sites out of ten use the same one. Fontshare offers foundry grade faces, free for commercial use, which makes the budget excuse hard to defend. On color, Realtime Colors changes the method entirely: instead of picking on a color wheel, you see your palette applied live on a real landing page. That is where you discover that a gorgeous blue in a swatch becomes unreadable as body text.
- uicolors.app : Turns one color into a full Tailwind scale, 50 to 950.
Icons, illustrations and media
The rule is simple: one pack per project. Icons from three different families are spotted immediately, even when nobody can say why the site feels cobbled together. Lucide is the default in React, Phosphor wins as soon as you want a specific tone thanks to its six weights, and Iconify works as the search engine when you need a genuinely unusual icon.
Performance, SEO and conversion
Ninety percent of a site’s weight is its images, and Squoosh handles that in minutes right in the browser. Then come the tools that answer the only question that really matters: why this site is not converting. Microsoft Clarity gives you heatmaps and session recordings, unlimited and with no credit card. It is probably the most underused tool on this entire list relative to what it costs.
- wave.webaim.org : One click accessibility audit: contrast, missing alt, heading hierarchy.
- responsively.app : Your site on ten screen sizes at once, with synced scrolling.
The order to use them in
These twenty tools do not belong to the same moment. Typography and palette are decided before the first line of code, because revisiting them later means reworking every component. Icons are chosen once, at the start, and never change again. Compression and audits come last, right before going live.
One exception: Clarity gets installed on launch day, not three months later when you are wondering why nobody fills in the form. Without a baseline, you will have nothing to compare against.
