Skip to content

Overview

Introduction

The documentation of the med.o Design System – guidelines, components and tokens for building med.o products.

design.med-o.de is the home of the med.o Design System. It shows you how to design and build med.o products that look and behave the same, so every team starts from the same parts instead of solving the same problems again.

Who it is for

The site serves everyone who works on a med.o product.

  • Designers find the rules behind each component and the matching parts in the Figma library.
  • Developers find how to install the packages, how to use each component and which tokens to choose.
  • Product owners find what the system offers today and what changed in each release.

Built with the system itself

This site is built with the same packages you install. Every page uses the components and tokens it documents, so you see them working in a real app, not only in isolated examples.

The packages come from npm, like in your own project. The site never shows a version that is not released.

Start with the packages

Install the components and the tokens with npm. The components need React 19.

npm install @med-o/ui @med-o/design-tokens