The documented collection of UI components

Make a smooth shadow, friend.

Style Dictionary is a build system that allows you to define styles once, in a way for any platform or language to consume. A single place to create and edit your styles, and a single command exports these rules to all the places you need them - iOS, Android, CSS, JS, HTML, sketch files, style documentation, or anything you can think of. It is available as a CLI through npm, but can also be used like any normal node module if you want to extend its functionality.

The goal of this project is to create a common library of generic web components, that are accessible, framework agnostic, easy to style, and easy to consume.

Hey 👋 I’m Adam. I help discover user needs and translate them into useful and usable services for everyone.

Live components

Using multiples of 8 to define dimensions, padding, and margin of elements.

Sea creatures in an infinite responsive dive-in.

Progressive Web Apps (PWA) are reliable, fast, and engaging, although there are many things that can take a PWA from a baseline to exemplary experience.

To help teams create the best possible experiences we've put together this checklist which breaks down all the things we think it takes to be a Baseline PWA, and how to take that a step further with an Exemplary PWA by providing a more meaningful offline experience, reaching interactive even faster and taking care of many more important details.

The new way to design, develop, and deliver software with confidence.

webhint is a linting tool that will help you with your site's accessibility, speed, security and more, by checking your code for best practices and common errors. Use the online scanner or the CLI to start checking your site for errors.

You may want to read the original Flexbox Holy Albatross post but basically, I missed a step (I was hungover): You can switch between horizontal (multi-column) to vertical (single column) Flexbox layouts just using flex-basis. No min-width or max-width needed — in fact, they just restrict Flexbox from doing its beautiful Flexbox thing.

No matter how many times I went through the process, there was always small touches that I missed when wrapping up my work. A link here, a back button there - there was always that minor but meaningful piece I would miss.

So this website is an attempt at listing out all the minimum requirements a page needs to satisfy the user experience for you, incase you ever get caught up with the finer details.

A plugin for Sketch to insert svg code into Sketch

A very big list of design, UX, tech and innovation conferences designed to get you out of the office and into some inspiration.

Take a closer look at how Atomic's features can supercharge everyday design tasks, as well as help you achieve high-fidelity large-scale prototypes.

A Single Div:  a CSS drawing project by Lynn Fisher