Inspiration
Modern web developers use countless CSS features without realizing whether they’re widely supported across browsers. Sometimes everything works perfectly… until it doesn’t , and a random user on an old browser sees a broken UI. We wanted to create a fun yet practical way to "measure your CSS risk factor" and encourage developers to write more future-friendly styles. That’s how CSS Rizzz was born, because your stylesheet should have rizz, not risk.
What it does
CSS Rizzz analyzes a GitHub repository, scans all its CSS-related files, extracts the CSS features used, and cross-references them with the Web Baseline compatibility database. Based on how widely supported (or experimental) your features are, it gives your project a Rizzz Score out of 10.
How we built it
Used the GitHub API to fetch repository contents. Parsed .css, .scss, .less, and inline blocks using PostCSS. Mapped detected CSS features to Web Baseline API data. Calculated an overall compatibility score based on safe vs risky vs unsupported features. Wrapped it in a slick web UI with meme-based feedback to keep things educational but chaotic.</p> <h2 id="challenges-we-ran-into">Challenges we ran into</h2> <p>Mapping raw CSS syntax to official spec-level features was surprisingly tricky — backdrop-filter vs filter: blur() shouldn’t be a philosophy debate. Some repos are MASSIVE, so we had to optimize scanning to avoid freezing the browser (and our sanity). Handling CSS-in-JS and nested frameworks like Tailwind or Styled Components required creative parsing tricks.</p> <h2 id="accomplishments-that-were-proud-of">Accomplishments that we're proud of</h2> <p>Built a fully automated CSS compatibility auditor powered by real browser support data. Made developer tooling actually fun, who knew compatibility warnings could roast you back? Created a system that helps beginners learn modern CSS safely without overwhelming them.</p> <h2 id="what-we-learned">What we learned</h2> <p>CSS has way more experimental features in the wild than expected, developers are either fearless or reckless. Parsing styles in 2025 means handling files that aren’t even .css. Humor is the best way to teach web standards.</p> <h2 id="whats-next-for-css-rizzz">What's next for CSS Rizzz</h2> <p>VS Code Extension that rates your CSS in real-time as you code. PR Comment Bot that auto-reviews pull requests with Rizzz Scores. Leaderboard for the riskiest (and safest) GitHub repos on the internet. Add AI-generated fallback suggestions when your CSS is too spicy for production.</p>
Log in or sign up for Devpost to join the conversation.