Standing on the shoulders of Subtle Patterns. Built and maintained by @mikehearn.

Negative border radius made easy
Nebo.css is a pure CSS solution that allows you to add a “convex” or “concave” puzzle angle to elements without SVG and JavaScript. Everything is controlled via custom CSS variables.

So much of the web these days is ruined by the bloat that is modern JavaScript frameworks. React apps that take several seconds to load. NextJS sites that throw random hydration errors. The node_modules folder that takes up gigabytes on your hard drive.

It’s awful. And you don’t need it.

conic-gradient(#FFFFFF 0%, #FFFFFF 9%, #FFAFC8 9%, #FFAFC8 18%, #74D7EE 18%, #74D7EE 27%, #613915 27%, #613915 36%, #000000 36%, #000000 45%, #E40303 45%, #E40303 55%, #FF8C00 55%, #FF8C00 64%, #FFED00 64%, #FFED00 73%, #008026 73%, #008026 82%, #24408E 82%, #24408E 91%, #732982 91%, #732982 100%)

Learn essential CSS techniques, scaling strategies, and design principles that preserve the crisp, totally-cool aesthetic of pixel graphics across high-resolution displays and responsive web environments.

Glassy headers have become a core part of the “slick startup” UI toolkit, but they’re all missing that final 10% that really makes it shine. In this tutorial, you’ll learn how to create the most realistic lush frosted glass anywhere on the internet.

Reasonable Colors is an open-source color system that makes it easy to build accessible, nice-looking color palettes.

An exploration of the newly supported at-rule for explicitly defining and animating custom properties in CSS.

CSS Grid Generator - a user-friendly tool designed for web developers to effortlessly create customizable CSS grids for seamless web development.

Learn how to finally solve the mystery of centering in CSS using grid, flexbox, and classic block element layout.

An evergreen CSS course and reference to level up your web styling expertise.

🎨 Curated collection of 95 free beautiful CSS box-shadow, ready-to-use for your next projects. Click to copy.

Visual guide to CSS selectors, including pseudo-classes (:nth-child, :hover,...), functional pseudo-classes (:not, :is,...) and pseudo-elements.

Generator to build organic shapes with CSS3 border-radius