Radius: A Design System Accelerator

The Radius DS is a collection of open-source tools and libraries that allow you to accelerate your design system. The choice of tools, their composition, and a set of foundational components guides you on how to build a constraint-based system.

Leverage the power of a design system without starting from scratch

Remove the guess work from building your design system, reducing the risk and effort required to to get started. Let's talk about how Radius can work for you.

Getting started

Everything you need to design, code and QA your own design system is listed here. Get a copy of our Figma files, clone our repository on GitHub, and see our live demo of the Radius DS documentation in action.

Design Kit

Built and maintained in Figma. It includes a set of foundational components and a reference architecture.

Component Library

Bootstrapped using TSDX, mirrors the Figma components and is built using Typescript, React, Styled System and Styled Components

Documentation & Sandbox

Storybook acts as both the developer sandbox and the documentation platform.

Test, Build & Deploy

Chromatic runs visual regression tests, CircleCI runs all other forms of testing and Netlify builds and deploys Storybook as a static site.

What will the Radius DS help me do?

Reduce decision fatigue

Building a new design system from scratch isn't easy. You are faced with several choices to make — framework, libraries, tooling and architecture. Radius takes the guess work out of building a design system, reducing the risk and effort required to to get started. You can start building an app today with a high quality, fully tested stack selected with care and intentionality baked-in. It eliminates much of the technical decision making required.
Radius accounts for:

Branding Flexibility

Performance

Accessibility

Automated QA

Build your app now, work on your design system later

Radius works equally well as a foundation for a greenfield application. Design systems are an excellent tool to scale shared understanding. You can start building an app today with all the tooling, infrastructure and a set of base components required for any application with a constraint-based system. As the need arises, you can easily extract a design system since all the foundation work is already done!

Opinionated, yet flexible

Radius is a seed project and not a library. It is built with composition in mind. You can replace any component or any part of the stack or create new things to extend it.

Join 10,000 of your peers. Subscribe to Rangle newsletter to get our best content.