## Design system font

Custom Typography utilities are available in the design system.

Used together with Tailwind typographic utilities classes.

Open Sans

regular 400

medium 500

semibold 600

bold 700

## Styles

### Headings

Heading element styles

# Heading 1

classes: rtds-heading-1

font: Open Sans

font size: 36px

## Heading 2

classes: rtds-heading-2

font: Open Sans

font size: 24px

### Heading 3

classes: rtds-heading-3

font: Open Sans

font size: 20px

#### Heading 4

classes: rtds-heading-4

font: Open Sans

font size: 18px

##### Heading 5

classes: rtds-heading-5

font: Open Sans

font size: 16px

###### Heading 6

classes: rtds-heading-6

font: Open Sans

font size: 14px

# Custom: 40px

classes: rtds-text-40px

font: Open Sans

font size: 40px

# Custom: 42px

classes: rtds-text-42px

font: Open Sans

font size: 42px

### Display Headings

Heading-like styles

Display 1

classes: rtds-display-heading-1

font: Open Sans

font size: 8rem - 128px

Display 2

classes: rtds-display-heading-2

font: Open Sans

font size: 6rem - 96px

Display 3

classes: rtds-display-heading-3

font: Open Sans

font size: 4.5rem - 72px

Display 4

classes: rtds-display-heading-4

font: Open Sans

font size: 3.75rem - 60px

Display 5

classes: rtds-display-heading-5

font: Open Sans

font size: 3rem - 48px

Display 6

classes: rtds-display-heading-6

font: Open Sans

font size: 2.25rem - 36px

### Body

Page body styles

Body xs

classes: rtds-body-xs

font: Open Sans

font size: 0.75rem - 12px

Body sm

classes: rtds-body-sm

font: Open Sans

font size: 14px

Body (principale)

classes: rtds-body

font: Open Sans

font size: 16px

Body lg

classes: rtds-body-lg

font: Open Sans

font size: 18px

Body xl

classes: rtds-body-xl

font: Open Sans

font size: 20px