Skip to main content

Welcome to the
Universal Design System

Three devices (laptop, tablet, and mobile) showcasing the same content on the screen in three different brands (TELUS, Koodo, and Public).
Get startedLearn more

Getting started

A multi-platform design system for the creation of digital products and experiences for TELUS, Koodo and Public Mobile.

Design

Use the latest design tools, learn the best practices and design principles to create beautiful and accessible digital experiences.

Read the Designer's guide

Develop

Check out everything you need to get started, from prerequisites, installation guides, React Native libraries and assets.

Read the Developer's guide

Components

Get to know the latest components and utilities. Learn how to use them and their accessibility features.

Explore the component library

Site Builder 2.0

Site Builder helps you publish content quickly and easily while using the latest UDS components.

See the Site Builder catalog

Same system, different brands

Access a comprehensive collection of robust, accessible, and customizable components, hooks, and utilities. Create a digital experience for a single brand or many, without duplicate effort.

TELUS Koodo Public Telus Health Casa Public Mobile Rebrand 

Features

Powered by the latest technologies and methodologies to enable accessible digital experiences to be delivered more consistently and quickly.

Design tokens

Scaling design decisions to enable theming brands, light and dark mode, and share them across platforms.

Explore how design tokens work
Green breasted hummingbird in flight with the TELUS logo
Stylistic bucket of ice cream sundae with the Koodo logo and slogan, choose happy
Illustration of a Black person holding up a mobile phone wearing a cape filled with wind.

Cross-platform

Leveraging the latest technologies that allow teams to build once and deploy anywhere. Solutions that work for web, iOS and Android.

Learn about base components
Illustrated outlines of devices mobile, tablet, laptop, and desktop

Interconnected systems

Empowering you to use what you need, when you need it, and the flexibility to extend the systems.

Learn about the architecture
Diagram of the many layers of the Universal Design System. The layers are labelled from the bottom to the top, base components, palettes, themes, brand components, domain components, and application. The layers are also grouped into universal layers (base components, palettes, and themes), brand layers (themes, brand components, and domain components), and delivery layers (brand components, domain components, and applications).

Cohesive customer experience

Providing the design tools, component libraries, best practices, and guidance to create the right customer experience across channels and products.

Check out all the features
Various icons representing the different business channels and digital products from internet, mobile devices, television, ecommerce, email, smartwatches, and customer service

Collaboration

All kinds of contributions are welcome. Request new features, report bugs, and create solutions. Contribute using your skills and available time.

Learn how to contribute
Various illustrations of people avatars with speech bubbles and ideas, speaking to each other

Support

Need help?

We’re ready to help you get started using the design system, troubleshoot issues, and support you along the way.

Want to contribute?

Community members are happy to share their expertise and learnings on how they successfully use the design system to support their projects and products.

Resources

Our team is ready to help you get started using the design system, troubleshoot issues, and support you along the way.