Best of Design Systems — January 2025

1. 1
   Video

   HuXn WebDev·1y

   THE MOST ADVANCE REACT.JS COURSE: THE BIGGEST REACT.JS COURSE ON THE INTERNET ( PART 4 )

   This comprehensive React.js course covers React fundamentals, hooks, TypeScript, UI component libraries, state management with Zustand and Redux Toolkit, animations with Framer Motion, and the testing of components. The final part delves into building a design system in Figma, leveraging tools like Storybook, Style Dictionary, and CLsx. It also includes setting up a complete authentication system and using Figma for creating design systems, and generating style tokens for consistency.

   238
2. 2
   Article

   Community Picks·1y

   Building a Design System as a Solo designer in a startup

   The post shares a detailed experience of building a design system as a solo designer in a startup environment. It highlights the challenges of creating an efficient design infrastructure, the process of learning and setting up components and documentation, and the importance of collaboration with engineering teams. The journey includes transitioning from initial failures to a more robust version using tools like ShadCN UI, Supernova, and AI integrations, resulting in significant improvements in product usability and company revenue.

   124

   3
3. 3
   Video

   Coding in Public·1y

   THE VSCode extension for design systems

   Enhance your design workflow in VSCode by using the CSS Var Complete extension to leverage CSS variables. This extension provides intellisense support for CSS variables, making it easier to access and use design tokens directly in your CSS files. Learn how to set up project-specific or global settings to automatically prompt collaborators to install the extension, ensuring a smooth development process.

   42

   1