Design Systems

Design Systems
Useful websites and links related to Design Systems
Laying the Foundations (a book about design systems)
A book about design systems by Andrew Couldwell. This is real talk about creating design systems and digital brand guidelines. No jargon, no glossing over the hard realities, and no company hat. Just good advice, experience, and practical tips.
designsystemfoundations.com
Design System Checklist
An open-source checklist to help you plan, build and grow your design system.
designsystemchecklist.com
Design Systems Repo
An organized and frequently updated collection of Design System examples, resources, tools, articles and videos.
designsystemsrepo.com
Design Systems Handbook—from DesignBetter.Co
Learn everything about design systems from leading experts and world-class teams, including Twitter, Salesforce, Airbnb, and more.
www.designbetter.co
Adele – Design Systems and Pattern Libraries Repository
Dozens of design systems and pattern libraries thoroughly analyzed. Learn, enjoy, contribute!
adele.uxpin.com
Ether is a modular base to start your design system.
Get the code and Sketch files to start your Spacing, Typography, and Color Systems. Made with love by The Scenery.
ether.thescenery.co
Lucid
lucid.style
Specify — All-in-one tool for design systems
Specify is a tool to create, scale and maintain a design system. Meet the ultimate bridge for digital product teams.
specifyapp.com
​
Design System / Branding / Assets Management
📣It’s here: Explore the new InVision DSM.
InVision DSM is the design system platform for collaborative teams, bringing designers, developers, and collaborators into a unified workflow.
brand.ai
UXPin - UI Design and Prototyping Tool
Design tool like no other. Prototypes that feel real, with powers of code components, logic, states and design systems. Join for free!
www.uxpin.com
Downloads - Lingo
Download Lingo apps and plugins.
www.lingoapp.com
https://zeroheight.com/
zeroheight.com
​
Design System Starter Packs
Straple Framework
www.straple.co
Design System for Sketch - Cabana
A Design System for Sketch that enables you to create UIs quicker, which means you can present your ideas much faster.
cabanadesignsystem.com
Atomize Design System
The most advanced UI design framework for Sketch and Figma
atomizedesign.com
Symbol Design 3
Symbol Design System 3 for Sketch
symboldesign.co
Nested Symbols & Auto-Updating Styleguides | Jan Losert - Store
The smartest template and your future starting point for every User Interfaces in Sketch. Stop wasting your time by crafting the same design systems and elements from scratch over and over and over again - and let the magic of this template’s nested symbols begin!
janlosert.com
UX Power Tools - A Design System UI Kit for Sketch
UX Power Tools is a design system UI kit for Sketch. It helps thousands of designers across the globe work faster, stay consistent, and deliver value.
www.uxpower.tools
Plaster - Mobile UI Kit and Design System for Sketch and Figma
Create beautiful Android & iOS applications with bulletproof guidelines built into a powerful design system.
plasterdesignsystem.com
Material Design System for Figma UI kit
Material Design System for Figma is based on 100% guidelines compliance and contains an impressive amount of scalable and constrained components to accelerate the application development. Including 1000+ dark & light UI components / 120 templates / 1000+ material icons
www.setproduct.com
Prime Design System Kit for Sketch
The Powerful All-In-One Design Start UI Kit for Sketch. The finest way to create UI Design or  UX Design System efficiently. Build with rich collection of UI components, charts, typography systems, illustration system, web UI kit and vector device templates prepared for Sketch app.
www.primedesignsystem.com
Web – Design System for Sketch & Figma
Slice — modular design system shaped from separate libraries to unify design with a consistent set of rules.
slice.design
​
Design System Documentation
Living Style Guides for Digital Products
With Catalog you combine design documentation with real, live     components in one single place, making collaboration between     designers and developers seamless.
www.catalog.style
https://compositor.io/
compositor.io
docsify
A magical documentation generator.
docsify.js.org
Fractal
Powerful component libraries & styleguides that fit the way you work.
fractal.build
GitBook - Document Everything!
Share knowledge, boost your team's productivity and make your users happy.
www.gitbook.com
patternplate
patternplate.github.io
Storybook: UI component explorer for frontend developers
Storybook is an open source tool for developing UI components in isolation for React, Vue, and Angular. It makes building stunning UIs organized and efficient.
storybook.js.org
​
Design System Helper Tools
Modulator
hihayk.github.io
MakeUI - We'll take care of UI
MakeUI is a tool which can generate a customized UI kit for you, with your input of a few of your brand identity attributes.
makeui.design
​
Design System E-mail Tool
Email Design System and UI Kit for Sketch and Figma
This email system includes a Sketch file and Figma file with email templates and components to make your life easier designing responsive email templates and collaborating with Developers and Marketers.
htmlemail.io
Design System Boilerplates
OSKRHQ Design System
oskrhq-ds.surge.sh
Wireframes and Starter Kits
Sections Wireframe Kit for Skech & Figma [UI Kit & Design System]
Sections Wireframe Kit is made up of a large set of pre-constructed 330+ layouts in 17 popular categories. The main engine of this UX kit is its design system — which gives you a wide range of options to speed up your web prototyping experience.
sections.pixsellz.io
Wireframe UI Kit [Sketch, Figma, Adobe XD]
The Dot. Prototype easy and fast with ready to go UI wireframe kit. Beautiful easy to use wireframe UI kit with more than 440 web and mobile layouts.
www.ls.graphics
​
Wireframe Templates
Test App
alexadam.github.io
Design System Tokens
gstudioapp/groselha-tokens
Tokens base architecture. Contribute to gstudioapp/groselha-tokens development by creating an account on GitHub.
github.com
Design System Books
Marvel | Free eBook | Getting Started with Design Systems
A free guide to getting started with design systems. Simple in structure, human in explanation and packed with insight
marvelapp.com
Design Systems Code
Done Design System by UI Lib
Done is Open source design system based on Bootstrap 4. Organized SASS code makes product development easier and faster.
uilibrary.github.io
​
Interaction Design - Previous
User Flows
Next - UI
Patterns
Last updated 5 months ago