Mathias Avatar

|

Last updated

Image hosting for Framer

Framer makes it easy to build modern, responsive websites visually. But when you’re managing lots of content like blog posts, portfolio projects, or product cards, you may need an external image host for more flexibility.

That’s where Img.vision comes in: a professional image hosting service designed for creators who want reliable, fast-loading images for their Framer sites, without complex setup or custom code.

Why use Img.vision instead of Framer uploads?

Framer’s built-in image uploads work fine for small sites. But when you scale up, you’ll quickly hit limits:

  • No centralized media library across projects
  • No built-in resizing or optimization
  • Manual re-uploading for reused images
  • Bandwidth and load-time issues on image-heavy pages

With Img.vision, you get permanent, CDN-delivered image URLs that can be reused anywhere, including dynamic Framer CMS collections.

The simple setup (inspired by the Framer community)

In the Framer community, designer Katlego Sean More recently shared a clean, no-code solution for using external image URLs in Framer CMS. You can use the exact same approach with Img.vision URLs.

Here’s how:

  1. Create a Text field in your CMS
    • In your Articles or Projects collection, add a new Text (single line) field called something like: imageUrl
    • Then, paste your Img.vision image URL there, for example: https://d.imgvision.net/drivename/portfolio-header.jpg
    • 💡 Important: Don’t use the “Link” field type. Framer’s Link fields store objects (href, target) that can’t bind to an image source. Text fields store a plain URL string and this is exactly what you need.
  2. Bind the image in your design
    On your detail page, select your Image layer.
    • In the right sidebar, set Source → URL
    • Click the database icon
    • Choose your CMS field (eg. imageUrl)
    • ✅ Your Img.vision image now loads dynamically per article or project.
    • Optional: Add a fallback placeholder and use “Show if → imageUrl is set” to hide the image when the field is empty.
  3. Repeat for list or card views
    For lists (like blog feeds or portfolios):
    • Wrap your cards in a CMS Collection List bound to your collection
    • Inside each repeated item, select the image → Source: URL → Bind to imageUrl
    • Add “Show if → field is set” conditions if some items don’t have an image

That’s it. Your Framer CMS will now pull images directly from Img.vision, fast, optimized, and consistent.

Why Img.vision works great for Framer

Global CDN delivery: Images load instantly for visitors worldwide.

Direct links, no API needed: Every image has a ready-to-use URL which works perfectly for pasting into CMS fields.

Auto-optimization: Images are automatically resized and compressed for web performance.

Always online: Unlike free hosts like Imgur or Dropbox, Img.vision never breaks links or throttles delivery.

Professional management: Replace or update an image once, and your Framer site updates everywhere.

Example use cases

  • Example use cases
  • Blog post thumbnails
  • Dynamic open graph (OG) images
  • Product photos in CMS collections
  • Client portfolio galleries

Test us with our free image hosting


Mathias Avatar

Last updated