Typography
HTML All Heading
Size        Lineheight        Weights
Heading 01
Heading 01
Heading 01 – Outfit | 64px or 4rem font-size / Bold
Heading 02
Heading 02
Heading 02 – Outfit | 40px or 2.5rem font-size / Semi Bold
Heading 03
Heading 03
Heading 03 – Outfit | 38px or 2.375rem font-size / Semi Bold
Heading 04
Heading 04
Heading 04 – Outfit | 26px or 1.625rem font-size / Semi Bold
Heading 05
Heading 05
Heading 05 – Outfit | 24px or 1.5rem font-size / Semi Bold
Heading 06
Heading 06
Heading 06 – Outfit | 22px or 1.375rem font-size / Semi Bold
H2 Heading
Available H2 Size Variants
We use multiple H2 sizes to support different layouts
while maintaining correct SEO and accessibility.
The heading tag controls meaning,
and the size preset controls appearance.
Why We Provide Multiple H2 Sizes
H2 / Default (20px)
Heading 02
H2 / Compact (18px)
Heading 02
H2 / Small (16px)
Heading 02
H2 / Micro (14px – optional)
Heading 02
Typography
HTML All Paragraph
Paragraph-Large
Paragraph – Outfit | 20px or 1.25rem font-size / 1.6em line-height / Semibold
Paragraph – Outfit | 20px or 1.25rem font-size / 1.6em line-height / Medium
Paragraph – Outfit | 20px or 1.25rem font-size / 1.6em line-height / Regular
Paragraph-Medium
Paragraph – Outfit | 18px or 1.125rem font-size / 1.6em line-height / Semibold
Paragraph – Outfit | 18px or 1.125rem font-size / 1.6em line-height / Medium
Paragraph – Outfit | 18px or 1.125rem font-size / 1.6em line-height / Regular
Paragraph-Small
Paragraph – Outfit | 16px or 1rem font-size / 1.5em line-height / Semibold
Paragraph – Outfit | 16px or 1rem font-size / 1.5em line-height / Medium
Paragraph – Outfit | 16px or 1rem font-size / 1.5em line-height / Regular
Paragraph-Extra small
Paragraph – Outfit | 14px or 0.875rem font-size / 1.5em line-height / Semibold
Paragraph – Outfit | 14px or 0.875rem font-size / 1.5em line-height / Medium
Paragraph – Outfit | 14px or 0.875rem font-size / 1.5em line-height / Regular
Border Radius
All Radius
Radius: xs
4px or 0.25rem
Radius: sm
6px or 0.375rem
Radius: md
8px or 0.5rem
Radius: lg
12px or 0.75rem
Radius: xl
16px or 1rem
Radius: xxl
Complete Circle