Skip to main content

What it is

Image displays a static visual on the screen.

What it’s best for

Use it when a still visual can explain the product, add credibility, or reinforce the message faster than more copy.

When to use it

  • Product screenshots
  • Lifestyle visuals
  • Brand logos
  • Illustrations that support onboarding education

When not to use it

  • Do not use large images that push the main action below the fold without a reason.
  • Do not add images that repeat the same message already communicated by text.

How to add it in the dashboard

  1. Open the screen in the dashboard.
  2. Add Image from the Components panel.
  3. Select the image on the canvas.
  4. In the properties panel, choose the image source and set the fit and size.
  5. Review how the image crops on the canvas before finalizing the layout.

Key parameters

ParameterWhat it changesWhen to adjust it
SourceChooses where the image comes fromUse it when switching between library assets and hosted images
Image source fieldSets which image appearsChange it when you update the visual message
WidthControls how wide the image appearsUse it when the image should feel more dominant or more compact
HeightControls how tall the image appearsUse it to preserve balance with surrounding copy
FitControls how the image fills its frameChange it when the image is cropping too aggressively or leaving empty space
MarginAdds space around the imageUse it to prevent the image from crowding nearby elements

Example use cases

  • A product screenshot that previews a feature before account creation
  • A trust-building customer logo strip near a trial CTA
  • A lifestyle image that sets the emotional tone of a welcome screen

Best practices

  • Choose visuals that support the business message, not just fill space.
  • Keep important parts of the image visible after cropping.
  • Use screenshots when you want clarity and illustrations when you want mood.

Common mistakes

  • Using images with weak contrast against the rest of the screen
  • Letting the image compete with the main call to action
  • Choosing decorative visuals that do not help users decide