The five best design links, every weekday

Category: Css

All Categories

smashingmagazine.com

Simplifying Form Styles With accent-color

The new CSS accent-color property makes it quick and easy to roll out our brand colors to certain form inputs by leveraging user agent styles.

css-tricks.com

Container Units Should Be Pretty Handy

Container queries are going to solve this long-standing issue in web design where we want to make design choices based on the size of an element.

giuseppegurgone.com

Twitter’s div Soup and Uglyfied CSS, Explained

To the eyes of somebody who’s not familiar with the framework, the HTML produced by React Native for Web might look utterly ugly.

css-tricks.com

Proposal for CSS @when

CSS is on a tear lately. Again, I’ve heard of a brand new thing I’ve never seen before, and again it’s via Miriam: CSS Conditionals.

css-tricks.com

Exploring the CSS Paint API: Polygon Border

Nowadays, creating complex shapes is an easy task using clip-path, but adding a border to the shapes is always a pain.

ishadeed.com

CSS Container Query Units

Using units that are relative to the container size

bram.us

The Future of CSS: Cascade Layers (CSS @layer)

When authoring CSS we have to carefully think about source code order, selector specificity, and the use of !important.

css-tricks.com

Grainy Gradients

Browse through Dribbble or Behance, and you’ll find designers using a simple technique to add texture to an image: noise.

joshwcomeau.com

Designing Beautiful Shadows in CSS

When I look around the web, most of the shadows I see are fuzzy grey boxes. It doesn’t have to be this way, though!

ishadeed.com

Less Absolute Positioning With Modern CSS

How to use use position:absolute less by leveraging modern CSS

web.dev

Building a split-button component

A foundational overview of how to build an accessible split-button component.

css-tricks.com

The Story Behind TryShape, a showcase for the CSS clip-path property

I love shapes, especially colorful ones!

stefanjudis.com

Can we have custom media queries, please?

CSS custom properties don’t work in media queries. Custom media queries could help out here but unfortunately, they’re not supported yet.

css-tricks.com

Early Days for CSS Scoping

There is a working draft spec for CSS scoping now, a newsworthy event for the W3C.

pollen.style

Introducing Pollen

Pollen is a library of CSS variables for rapid prototyping, consistent styling, and as a utility-first foundation for your own design systems.

smashingmagazine.com

Interactive Learning Tools For Front-End Developers

Interactive coding tools to help you learn CSS, JavaScript, SQL, React, Vim, regular expressions and Jamstack.

smashingmagazine.com

A Deep Dive Into The Wonderful World Of SVG Displacement Filtering

Let's see what the SVG feDisplacementMap filter primitive is, with a good number of examples to demonstrate the concept of animated displacement maps.

silvestar.codes

You want enabling CSS selectors, not disabling ones

An enabling selector is what I call selectors that do a job without disabling the particular rule.

ishadeed.com

Building A Stepper Component

Building a horizontal and vertical stepper component with CSS flexbox

joshwcomeau.com

An Interactive Guide to Keyframe Animations

In this deep-dive tutorial, we’ll learn how CSS keyframes work from the ground up, and see how to use them to build high-quality animations.