Introducing Prefill Embeds!

CodePen now lets you manage code from your own website.

Using CodePen to Show Prototypes to Clients

Rapid prototyping with CodePen.

Simple & Boring

What a lot of smart people have been telling us to be.

Web Development Merit Badges

A compilation that makes you smile.

How Do You Remove Unused CSS From a Site?

Partial solutions to a difficult problem.

Firefox 71: First Out of the Gate With Subgrid

Big deals in Firefox’s latest release.

Dark Mode Favicons

What you can already do in Chrome and Safari.

What it means to be a front-end developer in 2020 (and beyond)

​​Things change, but the guiding light not that much.

A Complete Guide to Links and Buttons

There is a lot to know: HTML, CSS, JavaScript, design, and accessibility.

‘lh’ and ‘rlh’ units

New units from the Level 4 spec for CSS values.

What is Developer Experience (DX)?

The different ways people think about and use the term.

An Upgrade to Emmet

New features in CodePen, the popular online code editor.

Thinking About Power Usage and Websites

Does good performance map to lower energy usage?

The Widening Responsibility for Front-End Developers

The checklist of things to do grows and grows.

Coding Fonts

A microsite that shows off fonts designed for writing code.

Design v18

The making of a fresh design for CSS Tricks.

Custom properties as state

A fun way to create a ‘living’ theme for your web site.

Fixing smooth scrolling with find-on-page

A hack to solve an issue with “scroll-behavior: smooth”.

Exploring color-contrast() for the first time

New CSS function gets the best color for a given contrast.

A complete guide to custom properties

Everything to know about CSS variables at a glance.

Auto-generated social media images

Pros and cons of different approaches and solutions.

target=blank

The astonishing difference between target=“_blank” and target=“blank”.

Zero-Width Space

Trick a system into thinking an URL isn’t a link or a single word is two words.

A look at building with Astro

A JavaScript framework that outputs zero-JavaScript static sites.

Early days for CSS scoping

There is a working draft spec for CSS scoping now.

Proposal for CSS @when

The next level of CSS Conditionals: when/else rules.

“Maybe a lot of the anti-CSS sentiment that people feel is rooted in the fact that CSS had gotten so good that more people are bothering to make it part of their responsibility.”

“Littttttle funny how ‘zero runtime’ has become an exotic way to mean ‘CSS’.”

Comparing HTML preprocessor features

A closer look at the features of more than a dozen HTML preprocessors.

CSS is going gosh-darned hog wild, I tell ya what

Get ready for “one of the hottest moments of innovation in CSS history.”

An interview with Elad Shechter on “the new CSS reset”.

First question: why do we need a new CSS reset?

Open Props (and custom properties as a system)

A smart technique to building a design system.

Top pens of 2021

100 amazing design and front-end creations.

Using the CSS Me Not bookmarklet to see (and disable) CSS files

A tiny tool helps to diagnose unnecessary CSS files.

CSS-Tricks is joining DigitalOcean

The popular site for front-end developers will continue to be open to anyone.

RSS

How we can simulate a social network with personal sites.

What does it look like for the web to lose?

It would suck, so let’s not have that happen.

Hex colors aren’t great at anything except being popular

An overview of color formats and their support in different design tools.

GPT-4 demo turns a crude sketch into a functional website

What cutting-edge artificial intelligence is capable of in web design.

Modern CSS in real life

New CSS things that really matter to real-world development.

CSS ‘margin-trim’ as a best practice?

What to expect from the upcoming CSS layout feature.

“If you make software that always works reliably, you’ve got a leg up.”

Web Components don’t need you

Chris Coyier’s take on the usefulness of Web Components.

Style scoped

What you can expect from the CSS @scope at-rule.

The ‘hanging-punctuation property’ in CSS

How to build a blockquote that starts with a curly-quote.