Streaming live at 10am (PST)

Adding illustrations to a site

Hi everyone.

I’m creating a website that uses some basic illustrations in the background of the design and I’m not sure how to go about making them responsive. I want them to stay within the boundaries of the section they are in. When I go down to tablet and mobile view and drag to view different viewport widths they don’t scale with the design the way I want them to. If anyone could give me some tips on this it would be really appreciated. I’ve included the read only site.

Thanks!


Here is my site Read-Only: Webflow - The Wild Olive Tree
(how to share your site Read-Only link)

hi @Atticus I presume you are talking about leaves png images. There is several ways. First you can use percentage or other flexible units. Another way is to create one SVG (your whole background design) and use it instead 3 independent images that need to be manually adjusted for each viewport.

On you text image change contain instead fill etc. etc.

One more thing I would like to mention, if you prefer to work with PNG you should optimise them as your images are way to big so you can work on this part as well as each unnecessary kb will increase page load.

hi @Atticus if you do not need further help feel free to close your request.

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.