My Tailwind style guide

We use Tailwind CSS in production to power our e-commerce frontend (Vue.js + SSR) and kept running into the same problem: jumping between the Tailwind docs to visually compare utility classes. So we built a single-page style guide that shows everything rendered side by side. ## What's in it Typography — every font size, weight, line height, and letter spacing rendered live Colors — full palette swatches with class names and hex values Spacing — padding and margin scale visualized with colored boxes Flexbox & Grid — common layout patterns with live examples Borders & Rounded — every border-radius variant from rounded-none to rounded-full Shadows — shadow-sm through shadow-2xl on actual cards Responsive breakpoints — table with pixel values + a live breakpoint indicator Common patterns — card, button set, navbar, and form components with copy-paste markup Every section includes the rendered result AND the code snippet. ## Check it out https://winkelstraatnl.github.io/tailwind-style-guide