Point: For details on how to upload image files and file size limits, see the articles below.
Image files you can use
Images uploaded to the Studio.Design editor
You can upload image files of up to 1 GB each and use them in your page designs.
Tips: Reducing image files larger than 1 GB
You can use a free image compression tool to reduce file size while keeping image quality intact. Studio.Design doesn't provide a built-in tool for changing file size.
Free images (Unsplash, Studio.Stock)
You can use images from "Unsplash", a high-quality free photo resource site, and "Studio.Stock", our service that provides high-resolution, high-quality AI-generated photo assets.
Images hosted outside of Studio.Design
By specifying a URL, you can use images hosted outside of Studio.Design, such as those stored on external storage services or your own server.
For instructions on how to specify a URL, see Specifying an image hosted on an external server by URL.
Adding an image box to your screen
You can add an empty image box, an uploaded image, or a free image to your screen.
Adding an empty image box
In the left navigation, click the [Add] icon
to open the Add panel.Click the [Basic] tab.
From the [Basic] menu, select the [Image] box, or drag and drop it onto your screen.
Adding an uploaded image
In the left navigation, click the [Uploads] icon
to open the Uploads panel.Click the image you want to add, or drag and drop it onto your screen.
Adding a free image (Unsplash, Studio.Stock)
In the left navigation, click the [Stock] icon
to open the Stock panel.Choose either the Studio.Stock or Unsplash tab, depending on which service you want to use.
Click an image, or drag and drop it onto your page.
Specifying an image hosted on an external server by URL
When you want to use an image hosted outside the editor — for example, on an external storage service — you can specify it by URL.
Select the image box.
In the right panel, click the [Image] tab.
* If the panel is closed, open the right panel.
Enter the image URL in the [URL] field.
Changing an image already placed on the screen
For details, see 9. [Basics] How to edit a template > Replacing text and images.
Open the [Upload & Replace] panel from the left panel.
You can open the panel using either of the following methods:
Double-click the target box on the screen.
Select the target box from the Layers panel, then double-click the image thumbnail in the [Image] tab of the right panel.
* If the panel is closed, open the right panel.
Click the [Uploads] or [Stock] tab depending on the type of image you want to use, then select an image.
Deleting an image box
Double-click the image box you want to delete.
From the menu that appears, select [Delete Box].
Tips: If you can't click the target box
If you can't click the target box, try using Direct Select or select it from the Layers panel.
Box mode and Img mode
Image boxes have two modes — "Box mode" and "Img mode" — and each mode handles images differently and offers different settings.
For more on each mode and how to use them, see Image box: Box mode and Img mode.
Applying background effects to an image (Box mode only)
With image boxes in Box mode, you can apply various effects to your image directly in the editor.
For details, see Image box: Applying background effects.
Image filters (brightness, contrast, saturation, monochrome, sepia, blur)
Background position
Background size
Repeat settings
Setting alt text for images (Img mode only)
For image boxes in Img mode, you can set alt (alternative text) to describe the image for search engines and screen readers. Setting this information is also very important for SEO.
For details, see Setting alt text for images.
Image AI
You can edit images directly in the Editor using natural language instructions.
This works with both images you've uploaded yourself and free images downloaded from the Stock panel.
You can describe your edits with text, and you can also attach a reference image for more specific direction.
Create and edit images that fit your design — all within Studio.Design.
How to edit images with AI
Place an image on your screen.
Click the Studio icon
above the image, then enter your edit instructions in the text field.If you have a reference image, click the image icon
to the right of the text field and upload it.
image picture
イメージ 写真 素材