OneDS
Home

We help you build Roche experiences that adapt to patient needs

We help you build Roche experiences that adapt to patient needs

The new OneDS provides guidelines, patterns, and code to help teams build consistent Roche digital experiences that anticipate patient needs.

Find out more Watch video

Benefits

OneDS brings Roche's digital products together, helping teams build experiences that are consistent, flexible, and intuitive.

Consistency
Consistency A design language that makes Roche products recognizable and cohesive.
Multi-Brand
Multi-Brand Built-in support for multiple brands and themes across the portfolio.
Multi-Platform
Multi-Platform Designed for web, mobile, and diverse devices with consistent behavior.
Efficiency
Efficiency Reusable patterns and components that help teams build faster.
Accessibility & Compliance
Accessibility & Compliance WCAG-compliant and aligned with Roche quality standards.
Framework-Agnostic
Framework-Agnostic Compatible with major front-end frameworks and workflows.

Build experiences

Foundation
Foundation Core design decisions such as color, typography, spacing, motion, and tokens.
Components
Components Reusable building blocks with usage, behaviour, and implementation guidance.
Patterns
Patterns Common interaction and layout solutions for recurring product scenarios.
Tools
Tools Design and development tools that support system adoption and workflow.
Accessibility
Accessibility Accessibility principles, requirements, and best practices.

Scale your product

Adoption
Adoption Guidance on rolling out, integrating, and scaling the design system.
Roadmap
Roadmap Upcoming features, improvements, and planned initiatives.

Here to help

Resources
Resources Guidelines, documentation, and supporting materials for teams.
Meet the team
Meet the team Get to know the people behind the design system.
What's new
What's new Latest updates, releases, and improvements to the design system.