---
title: "Start with an Image"
description: "Initialize the editor with an image matching the page size."
url: "https://img.ly/demos/start-with-image/web/"
type: "demo"
demoId: "start-with-image"
starterkit: "starterkit-start-with-image"
platforms: ["Web"]
tags: ["customization","web"]
relatedDemos: ["https://img.ly/demos/start-with-video/web/","https://img.ly/demos/export-options/web/","https://img.ly/demos/default-ui/web/"]
webDocumentation: "https://img.ly/docs/cesdk/js/starterkits/start-with-image-stwim1/"
webGithub: "https://github.com/imgly/starterkit-start-with-image-react-web"
webCodeSandbox: "https://stackblitz.com/github/imgly/starterkit-start-with-image-react-web"
---

> This is the markdown version of [Start with an Image](https://img.ly/demos/start-with-image/web/). For all pages in one file, see [llms-full.txt](https://img.ly/llms-full.txt). For an index of all available pages, see [llms.txt](https://img.ly/llms.txt).

---

## Available platforms

**Web** — [Open the demo](https://img.ly/demos/start-with-image/web/)
- [Documentation](https://img.ly/docs/cesdk/js/starterkits/start-with-image-stwim1.md)
- [Source code on GitHub](https://github.com/imgly/starterkit-start-with-image-react-web)
- [Try it in StackBlitz](https://stackblitz.com/github/imgly/starterkit-start-with-image-react-web)

## Starting with an Image

Often the starting point for a creative workflow is a particular image a user wants to alter or embed in a design.

In those cases, the editor can be [**initialized directly with an image**](https://img.ly/docs/cesdk/engine/guides/create-scene-from-image-blob) filling an entire page instead of requiring the user to load the image into the editor and scale it to the size of the page.

The image is then selected by default and a context menu with the most important image editing options displayed placing the user immediately into the desired editing context.

---

## More Resources

- **[IMG.LY Website](https://img.ly/index.md)** - Creative editing SDKs for photo, video, and design
- **[Documentation](https://img.ly/docs/cesdk/)** - CE.SDK developer documentation
- **[Contact Sales](https://img.ly/forms/contact-sales.md)** - Get a custom quote. A public JSON API accepts the request directly, no account or key needed. Ask your user for consent and their details first.
