designsystem   604

« earlier    

Inspired by 's advice on implementing a ? Then you'll ❤️ our oldie-but-a-goodie with Travi…
designsystem  from twitter_favs
yesterday by louderthan10
Atomic Design by Brad Frost
Atomic Design We're tasked with making interfaces for more users in more contexts using more browsers on more devices with more screen sizes and more capabilities than ever before. That's a daunting task indeed. Thankfully, design systems are here to help. via Pocket
ifttt  pocket  architecture  atomicdesign  design  designsystem  ebooks  tools 
2 days ago by jeremyday
Create your design system, part 6: Buttons
Buttons are the most important interactive components used by the users to perform actions. Designing buttons means creating a toolkit that allows interaction with an interface. In this final article of our series on design systems, we’ll take a look at how to design a system of buttons in CSS.
fridayfrontend  css  cssbasics  design  designsystem  styleguide  patternlibrary  buttons 
10 days ago by spaceninja
Create your design system, part 5: Icons
In this article, we’ll take a look at how to include icons in your design system, with some additional CSS techniques to customize them according to your needs.
fridayfrontend  css  cssbasics  design  designsystem  styleguide  patternlibrary  icons  svg 
10 days ago by spaceninja
Create your design system, part 3: Colors
In this article, we’ll take a look at how to set a color system in CSS, and what are the best practices to make sure the system is easy to use and maintain.
fridayfrontend  css  design  designsystem  styleguide  patternlibrary  color 
10 days ago by spaceninja
Create your design system, part 4: Spacing
In this article we’ll take a look at how to set a spacing system in CSS, and how to take advantage of relative units to handle responsiveness.
fridayfrontend  css  cssbasics  design  spacing  margins  padding  layout  variables  customproperties  designsystem  styleguide  patternlibrary 
10 days ago by spaceninja
Thanks for having me and the story on the preparty this evening. Relaxing now an…
smashingConf  designsystem  from twitter_favs
11 days ago by joshclark
The key lessons I learned creating a popular Design System
With the uptick in design systems discussions over the last couple of years, I’m occasionally asked for tips or insights from my experience building the design system at Atlassian. If you have considered creating one for your product or company, are in the process of making one, or have tried and given up, hopefully these insights will help you create a better design system for your company.
fridayfrontend  css  design  designsystem  patternlibrary  styleguide 
16 days ago by spaceninja
An open source collection of Design Principles and methods.
Designsystem  designguides 
21 days ago by guildford
Semantic HTML for Colors
I think we're at a time in Web design where colors have become first class citizens that deserve to have their own, semantic HTML element. This is especially true given the role and importance of color swatches in design systems today. I wouldn’t mind having a <color> element for that. But, unfortunately, we don’t have HTML elements dedicated for colors swatches. Or, do we?
color  html  semantics  svg  inputs  swatches  patternlibrary  styleguide  designsystem 
22 days ago by spaceninja

« earlier    

related tags

!great  a11y  accessibility  apps  architecture  article  articles  atomic  atomicdesign  bestpractices  blog  books  branding  buttons  by:jeremykeith  cadence  cards  case  casestudy  collection  color  community  components  conference  css-in-js  css  cssbasics  cssgrid  customproperties  design+systems  design-systems  design  designguides  designpatterns  designprinciples  designresources  designsites  designsystems  designthinking  designtools  development  diagram  documentation  dokumentation  ebooks  figma  flexbox  forwork  frameworks  fridayfrontend  github  grid  grids  guide  guidelines  html  icons  ifttt  illustration  inputs  inspiration  interactiondesign  ixd  javascript  layout  lean  learndesign  library  list  margins  material  medium  modularcontent  names  nypl  padding  patternlibrary  patterns  performance  pocket  primer  process  progressiveenhancement  quotes  react  reference  release  resourcelist  resources  roi  scale  semantics  ship  sketch  smashingconf  spacing  standards  styleguide  svg  swatches  system  systems  teams  tokens  tool  tools  typography  uber  ui  ux  variables  video  vuejs  webdesign  webdev  wework  zeplin 

Copy this bookmark: