Hosted Images
The simplest way to drop hosted images into your Framer projects. Works seamlessly with Framer’s CMS, just paste a URL. Perfect for large files and bulk imports of images.
Make it with Workshop
Build your own component with AI
About this Component
About this component
Bring your hosted images into Framer with ease. This component is built for designers and teams who manage assets externally — whether that’s large high-resolution images, entire image libraries, or files tracked in a CMS like Google Sheets, Airtable, or Framer’s own CMS.
Instead of re-uploading or duplicating files inside Framer, just drop in the URL of your hosted image. The component handles rendering, scaling, customizable background color, and fallbacks automatically, so your workflow stays simple and consistent.
Perfect if you work with big image collections, need to keep a CMS as your single source of truth, or just want to avoid bloated project files — HostedImage helps you keep everything clean, fast, and easy to maintain.
Features
• Render any hosted image directly via URL
• Built-in placeholder with a neat “Enter Image URL” prompt
• Customizable background color (always present, even after load)
• Automatic fallback if the image fails to load
• Fully responsive — scales with any frame size in Framer
• Supports multiple object-fit modes (cover, contain, fill, etc.)
• Works perfectly with Framer’s CMS, plus Google Sheets, Airtable, and other setups
• Lightweight and efficient for large or numerous images
• Defaults to 300×300 but adapts to parent frame constraints
• Works seamlessly inside Framer’s visual canvas
