Daily Curated Design News and Resources

I want a world built to make ourselves more capable with AI, not just to have more capable agents to talk to.

Discover how Microsoft redesigned the Copilot icon using shape, color, and motion to create a unified identity that communicates across apps and devices.

A great icon cannot just look good on its own. It has to feel like it belongs.

The idea is you write the viewport sizes in @media, set a named token on :root, and access it with a style query instead of repeating the media query.

CSS can now handle tooltip and dropdown positioning without JavaScript. Learn how anchor positioning, popovers, and anchor-size() simplify UI.

AI is not a substitute for divergent thinking, and the false certainty it gives will never save you from having to iterate.

blue-500 means whatever its palette decided it means, and in many of the palettes teams use, that is only where the shade sits in the ramp.

These are five principles I've been working through. Some get more difficult when you put them together, particularly when you move from someone speaking at their desk to someone talking through their AirPods with their phone in their pocket.

Drop-in animated toggles for React, Svelte, and Vue. Install with shadcn/ui, npm, or copy the source.

Router- and framework-agnostic — React, Svelte, Vue, Solid, Angular, and Qwik. Built on the Web Animations API, beyond what View Transitions can do.

Instead of considering how we build our products to fit the world of AI, we should be thinking about how to build AI that behaves like a native species in the ecosystem of human behavior.

Timeless Grotesk, Sans, Serif and Text — four variable typefaces with matching italics, free for personal and commercial use.

My friend Cameron and I trained a language model to make images by writing code, using reinforcement learning.

In a world in which you can make anything, you still have to make something useful.

These are the superfamilies on Google Fonts. I've only included superfamilies where sans and serif typefaces are available, which have at least 3 styles per typeface, and which are not too decorative for general use.

How a few pencil sketches turned into a matchstick you can strike, and why the flicker needed three sine waves instead of one.

Honest uncertainty is exactly the material you need when designing though. In design things are rarely binary.

When agents write most of the code, the design system can become part of what I've called the AI steering layer: the context that keeps every website update aligned with brand, design, and development guidelines.

Creativity doesn't flourish when we push harder. It flourishes when we create conditions that allow it to thrive.

Rows (using column-wrap) provide a way to use multicol on the web without risking scrolling up and down to read if the columns become taller than the viewport.

Tactics from the best design teams and individuals working today, with notes on how the work got made.

EmDash started with a question: what would WordPress look like if it were built today.

A component library of well-crafted, animated AI status indicators for React. No dependencies, 3.8 KB gzipped.

The safeguards we put in place enabled us to roll out significant architectural changes safely, stress test in production, catch errors, pivot and repair efficiently, ultimately allowing us to succeed in our goals and realize great performance gains along the way.