A basic example

TwicPics is a Responsive Image Service Solution (SaaS) that enables on-demand responsive image generation.

TwicPics Components make it dead easy to unleash the power of TwicPics.

Here the properties used in this example:

ratio: determines the value of the width/height ratio of the image display area.
mode: determines if the image fills or sits inside the area.
focus: changes the focus point coordinates of the image.
placeholder: helps optimize your CLS and implement the LQIP technique.

Default values

ratio="16/9"&mode="cover": the image fills the area

ratio="16/9"&mode="contain": the image sits inside the area

ratio="2/3",mode="contain"&focus="auto"