Skip to content

Main Navigation

Atoms

Inputs

SegmentedControl

Layouts

Molecules

Organisms

ProgressTracker

ZDS Components Library

ZDS Components Library V2

ZDS Data Library

Sidebar Navigation

Release notes

Roadmap

Resources

Getting started

About

Introduction

Processes

How to start

Introduction

Basic concepts

How it works

Packages

Overview

@zurich/dev-utils

@zurich/design-tokens

@zurich/css-components

@zurich/web-components

@zurich/react-native

Support

Components status

FAQs

Foundations

Introduction

Breakpoints

Spacers

Layouts

Flex

Grid

Colors

Intro

Palettes

Shadows

Typography

Intro

Text styles

Themes

Icons

Pictograms

Images

Atoms

Introduction

Badge 🧪

Code

Figma

Button 🧪

Code

Figma

Chip 🧪

Code

Currency 🧪

Code

Date 🧪

Code

Icon 🧪

Code

Figma

Image 🧪

Code

Figma

Link 🧪

Code

Loader 🧪

Code

Figma

Logo 🧪

Code

Figma

Number 🧪

Code

Pictogram 🧪

Code

Figma

Profile 🧪

Code

ProgressBar 🧪

Code

Figma

SafeSpace 🧪

Code

Figma

Shape 🐞

Code

Figma

SmilingZ 🧪

Code

Figma

Tag 🧪

Code

Figma

Time 🐞

Code

Toast 🧪

Code

Figma

Tooltip 🧪

Code

Figma

Inputs

Introduction

BooleanIcon 🧪

Code

Checkbox 🧪

Code

Figma

CheckboxGroup 🐞

Code

ChipsSet ⛔

Code

DateInput 🧪

Code

MultiInput ⛔

Code

Multiselect ⛔

Code

NumberInput 🧪

Code

Pagination 🧪

Code

Figma

PasswordInput 🧪

Code

RadioSelect 🧪

Code

Figma

Rating 🐞

Code

SegmentedControl 🧪

Code

Figma

Select 🧪

Code

Slider 🐞

Code

Figma

Switch 🧪

Code

Figma

TextInput 🧪

Code

Figma

Textarea 🧪

Code

Figma

TimeInput 🧪

Code

Layouts

Introduction

Accordion 🧪

Code

Figma

Card 🧪

Code

Figma

Carousel ⛔

Code

Figma

Dropdown 🧪

Code

Figma

Fieldset 🧪

Code

Form 🧪

Code

ListItem ⛔

Code

Modal 🧪

Code

Figma

Sidebar ⛔

Code

Figma

Stage ⛔

Code

Figma

Table ⛔

Code

Figma

Tabs ⛔

Code

Figma

Molecules

Introduction

ActionCard 🐞

Code

Alert 🧪

Code

Figma

ArticleCard 🐞

Code

Avatar 🧪

Code

AvatarList 🧪

Code

Breadcrumbs 🐞

Code

Figma

FloatingBanner ⛔

Code

Promo 🐞

Code

Figma

Quote 🧪

Code

Figma

ShareBar 🧪

Code

Figma

ShareButton 🐞

Code

Figma

StageBanner ⛔

Code

Figma

Functionalities

Introduction

Request 🧪

Organisms

Introduction

AsyncContent ⛔

Code

Footer ⛔

Code

Navigation ⛔

Code

Figma

ProgressTracker ⛔

Code

Figma

Development

Introduction

Documentation

VS Code

Index

Table of Contents for current page

Async content

...

Last updated:

Previous pageIntroduction