sunweb

Aspect Ratios

foundations aspect-ratios

Definition


The aspect ratio foundation defines the proportional relationship between the width and height of the images that are part of the components.


aspect-ratio--5:4 0.8
5:4

aspect-ratio--1:1 1
1:1

aspect-ratio--4:3 0.75
4:3

aspect-ratio--3:2 0.6666666666666666
3:2

aspect-ratio--16:9 0.5625
16:9

aspect-ratio--2:1 0.5
2:1

aspect-ratio--5:2 0.4
5:2

aspect-ratio--3:1 0.3333333333333333
3:1

aspect-ratio--4:1 0.25
4:1

aspect-ratio--5:1 0.2
5:1

aspect-ratio--golden-h 0.6180469715698392
golden-h

aspect-ratio--golden-v 1.618
golden-v