Aller au contenu

Sizes

Ce contenu n’est pas encore disponible dans votre langue.

This page lists all Sizes CSS custom properties available in the OxyProps Framework

Fluid Sizes

link Fluid Sizes
ValueCSS VariableUtility Class
clamp(.5rem, 1vw, 1rem) --o-size-fluid-1 o-size-1
clamp(1rem, 2vw, 1.5rem) --o-size-fluid-2 o-size-2
clamp(1.5rem, 3vw, 2rem) --o-size-fluid-3 o-size-3
clamp(2rem, 4vw, 3rem) --o-size-fluid-4 o-size-4
clamp(4rem, 5vw, 5rem) --o-size-fluid-5 o-size-5
clamp(5rem, 7vw, 7.5rem) --o-size-fluid-6 o-size-6
clamp(7.5rem, 10vw, 10rem) --o-size-fluid-7 o-size-7
clamp(10rem, 20vw, 15rem) --o-size-fluid-8 o-size-8
clamp(15rem, 30vw, 20rem) --o-size-fluid-9 o-size-9
clamp(20rem, 40vw, 30rem) --o-size-fluid-10 o-size-10

Fixed Sizes

link Fixed Sizes
ValueCSS VariableUtility Class
-.5rem --o-size-000 o-size-fixed-000
-.25rem --o-size-00 o-size-fixed-00
.25rem --o-size-1 o-size-fixed-1
.5rem --o-size-2 o-size-fixed-2
1rem --o-size-3 o-size-fixed-3
1.25rem --o-size-4 o-size-fixed-4
1.5rem --o-size-5 o-size-fixed-5
1.75rem --o-size-6 o-size-fixed-6
2rem --o-size-7 o-size-fixed-7
3rem --o-size-8 o-size-fixed-8
4rem --o-size-9 o-size-fixed-9
5rem --o-size-10 o-size-fixed-10
7.5rem --o-size-11 o-size-fixed-11
10rem --o-size-12 o-size-fixed-12
15rem --o-size-13 o-size-fixed-13
20rem --o-size-14 o-size-fixed-14
30rem --o-size-15 o-size-fixed-15

Content Sizes

link Content Sizes
ValueCSS VariableUtility Class
20ch --o-size-content-1 o-content-1
45ch --o-size-content-2 o-content-2
60ch --o-size-content-3 o-content-3

Heading Sizes

link Heading Sizes
ValueCSS VariableUtility Class
240px --o-size-xxs o-header-1
25ch --o-size-header-2 o-header-2
35ch --o-size-header-3 o-header-3

Breakpoints Sizes

link Breakpoints Sizes
ValueCSS Variable
240px --o-size-xxs
360px --o-size-xs
480px --o-size-sm
768px --o-size-md
1024px --o-size-lg
1440px --o-size-xl
1920px --o-size-xxl