47 HTML/CSS resources for web designers and developers

Minimal snippets for modern CSS layouts and components.

A Geocities theme for Twitter Bootstrap, from Divshot.

A simple hand drawn HTML/CSS theme.

Check if a chosen HTML tag can be nested inside another HTML tag according to the spec.

CUBE CSS is a CSS methodology that’s orientated towards simplicity, pragmatism and consistency. It’s designed to work with the medium that you’re working...

Code generators to help you with your front-end web projects. CSS, HTML, OpenGraph, JSON, Meta Tags, Twitter Cards and more.

Collection of common CSS mistakes, and how to fix them.

A tiny, Sass-powered design-token led utility class generator, with handy helpers, that helps you to power your front-ends with a single source of truth.

Handy guide to every HTML element there is. Replace your divs with more semantic markup.

Short code snippets ready to use covering CSS, JS, React, Python, Git and more.

CSS Stats provides analytics and visualizations for your stylesheets. This information can be used to improve consistency in your design, track performance of...

A simple visual cheat sheet for Flexbox.

A valuable (and fun!) interactive challenge to help learn CSS selectors.

View demos of all cursor styles available to you with CSS.

Handy cheat sheet for writing CSS with Sass.

Modern CSS solutions for old CSS problems by Stephanie Eckles.

Cool customisable tooltips made from pure CSS.

Popular layouts and patterns made with CSS.

Classless CSS framework to publish great looking pages with just HTML.

Handy cheat sheet for the short-hand HTML syntax Emmet.

A modern CSS showcase styled by community contributions.

Free themes for Bootstrap.

Blobmaker is a free generative design tool made with 💕 by z creative labs, to help you quickly create random, unique, and organic-looking SVG shapes.

Animate CSS gradients.

A gallery of fantastic and unique CSS gradients.

Generate duotone images from your photos with CSS.

Click on the animation to copy.

Sass News is a curated publication full of interesting, relevant links for all things Sass. Subscribe now and never miss an issue.

A once–weekly roundup of the best front-end news, articles and tutorials. HTML, CSS, WebGL, Canvas, browser tech, and more.

A simple and customisable Flexbox grid system.

Tasty CSS-animated hamburgers.

Welcome to Flexbox Froggy, a game where you help Froggy and friends by writing CSS code!

Welcome to Grid Garden, where you write CSS code to grow your carrot garden! Water only the areas that have carrots by using the grid-column-start property.

You can set the numbers, and units of your columns and rows, and I'll generate a CSS grid for you! Drag within the boxes to create divs placed within the grid.

When you use eight values specifying border-radius in CSS, you can build organic looking shapes.

Does what it says on the tin. The clip-path property allows you to make complex shapes in CSS by clipping an element to a basic shape (circle, ellipse,...

CSS gradient generator and swatches.

100 days CSS coding challenge.

Making the web more beautiful, fast, and open through great typography.

Typeplate is a “typographic starter kit”. We don’t make aesthetic design choices, but define proper markup with extensible styling for common typographic...

Just-add-water CSS animations.