Image Ratio

Ratio Classes: Change your image proportion by just adding class

If you use image as background than add class .bg-img in image and add below class in parent.

Types of Ratio
  • .ratio_40 - 40%
  • .ratio_45 - 45%
  • .ratio2_1 - 50%
  • .ratio2_3 - 60%
  • .ratio3_2 - 66.66%
Ratio for different shapes
  • .ratio_landscape - 75%
  • .ratio_square - 100%
  • .ratio_asos - 127.77%
  • .ratio_portrait - 150%
  • .ratio1_2 - 200%

ratio - "ratio2_3"

Add this class "ratio2_3" for this type of ratio

ratio - "ratio_square"

Add this class "ratio_square" for this type of ratio

ratio - "ratio_portrait"

Add this class "ratio_portrait" for this type of ratio

Layout type
Light Dark
Layout Direction
LTR RTL
Unlimited Color