Search
Collective #733
13.10.2022
New patterns for amazing apps * Randoma11y * Design Systems For Figma * Layout Breakouts with CSS Grid
Build, Ship, & Maintain Design Systems with Backlight
27.1.2022
(This is a sponsored post.)
Design systems are an entire job these days. Agencies are hired to create them. In-house teams are formed to handle them, shipping them so that other teams can use them and helping ensure they …
Build, Ship, & Maintain Design Systems with Backlight originally...
How Do You Handle Component Spacing in a Design System?
26.1.2022
Say you’ve got a <Card /> component. It’s highly likely it shouldn’t be butted right up against any other components with no spacing around it. That’s true for… pretty much every component. So, how do you handle component spacing in …
How Do You Handle...
Build and Ship a Design System in 8 Steps Using Backlight
24.1.2022
Learn how to use Backlight, an all-in-one collaborative tool that allows teams to build, ship, and maintain Design Systems at scale.
The post Build and Ship a Design System in 8 Steps Using Backlight appeared first on Codrops
Yes, Design Systems Do Improve Developer Efficiency and Design Consistency
5.11.2021
One of the toughest things about being someone who cares deeply about design systems is making the case for a dedicated design system. Folks in leadership will often ask you to prove the value of it. Why should we care …
The post Yes, Design Systems Do Improve Developer Efficiency and Design...
Different Degrees of Custom Property Usage
14.10.2021
One way to work with Custom Properties is to think of them as design tokens. Colors, spacings, fonts, and whatnot. You set them at the root of the page and use them throughout your CSS. Very useful, and the classic …
The post Different Degrees of Custom Property Usage appeared first...
2021 Design Systems (Survey/Courses)
14.5.2021
My friends at Sparkbox are doing a survey on design systems, as they do each year. Go ahead and fill it out if you please. Here are the results from last year. In both 2019 and 2020, the vibe was …
The post 2021 Design Systems (Survey/Courses) appeared first on CSS-Tricks.
You can support...
Where the World Wide Web Shines
1.4.2021
Here’s a fabulous post by Vitaly Friedman that looks at how to make accessible front-end components and what problems there are today when it comes to building them.
There’s so much great info packed into this one post that I’m …
The post Where the World Wide Web Shines appeared first...
Using Your Own Design System with KendoReact Components
30.10.2020
Maybe you’ve already heard of (or even worked with!) KendoReact. It’s popped up in some of my day-to-day conversations, especially those about working with design systems and React. You could think of it as a component library like Bootstrap or Material Design, except the components...
People Problems
16.10.2020
Just the other day, Jeremy Keith wrote that problems with performance work isn’t only a matter of optimization and fixing code, but also tackling people problems:
It struck me that there’s a continuum of performance challenges. On one end of the continuum, you’ve got technical issues. These can...
Collective #612
2.7.2020
60 Days of Animation * Stryve * The design systems between us * html.systems * Design Better Buttons
The post Collective #612 appeared first on Codrops
The Best Design System Tool is Slack
4.6.2020
There’s a series questions I have struggled with for as long as I can remember. The questions have to do with how design systems work: Where should we document things? Do we make a separate app? Do we use a third-party tool to document our components? How should that tie into Figma or Sketch?...
How to build a bad design system
31.3.2020
I didn’t realize this until it was far too late, but one of the biggest mistakes that’s made on a design systems team is a common mismanagement issue: there are too many people in a meeting and they have too many dang opinions.
Is there a conversation about the color of your buttons that’s taking...
Sass !default and themeable design systems
11.3.2020
This is a great blog post from Brad Frost where he walks us through an interesting example. Let’s say we’re making a theme and we have some Sass like this:
.c-text-input {
background-color: $form-background-color;
padding: 10px
}
If the $form-background-color variable isn’t defined then...
Design Systems Blogathon
11.2.2020
It was fun watching a bunch of back and forth blogging between a bunch of smart people quoting a bunch of smart people last week. If you missed it, you might wanna start at the end and work backward.
I only have one tidbit to add. I don't do much with design systems as someone who works on pretty...
Systems, Mistakes, and the Sea
6.1.2020
Our own Robin Rendle:
[...] folks can’t talk about real design systems problems because it will show their company as being dysfunctional and broken in some way. This looks bad for their company and hence looks bad for them. But hiding those mistakes and shortcomings by glossing over everything...
Making Room for Variation
30.12.2019
Say you have a design system and you're having a moment where it doesn't have what you need. You need to diverge and create something new. Yesenia Perez-Cruz categorizes these moments from essentially ooops to niiice:
There are three kinds of deviations that come up in...
Two Lessons I Learned From Making React Components
19.12.2019
Here’s a couple of lessons I’ve learned about how not to build React components. These are things I've come across over the past couple of months and thought they might be of interest to you if you’re working on a design system, especially one with a bunch of legacy technical decisions and a lot...
Design APIs: The Evolution of Design Systems
17.12.2019
A clever idea from Matthew Ström:
[...] design APIs don’t seem like a stretch of the imagination. An API-driven approach is the natural extension of the work currently being done on design systems, including tokens and standardization projects.
If you buy into the idea of design tokens, that...
Collective #568
25.11.2019
Global Design Survey 2019 * HexaBeat * Creepyface * Design APIs: The Evolution of Design Systems * Print To CSS
Collective #568 was written by Pedro Botelho and published on Codrops