Studio places photos as layers you can crop, filter, run Bitgrain effects on, and dress up with paper treatments like torn edges, polaroid frames and tape. This page covers adding images, the two kinds of image layer, shadow and glow, and fitting a page to a photo.
There are several ways to bring a picture into a design. They all end up as an image layer on the active page.
| Method | How |
|---|---|
| Add Image | Click Add Image in the floating toolbar, or Add image on the collapsed left panel rail. |
| File menu | File then Import image… opens the same dialog. |
| Drag and drop | Drop one or more image files anywhere on the editor. You can also drag an image straight from another browser tab. |
| Paste | Copy an image (for example a screenshot) and press Cmd / Ctrl + V while you are not typing in a text box. |
The dialog has two tabs.
Enter). If the link does not lead to an image, you see Could not load an image from that link.Note: Linked images stay linked to the website they came from. If that site stops serving the image, or blocks other sites from using it, it may not show up in your export. Upload the file instead when it matters.
New images are placed in the middle of the page at their own proportions, up to half the page's width. Uploaded pictures stay in your browser; nothing is sent to a server for processing. See privacy and determinism.
Studio has two image layer types. Both are titled Image in the right panel, but they have slightly different controls.
| Uploaded image | Image slot | |
|---|---|---|
| Where it comes from | Anything you add yourself: upload, paste, drop or link. | Mostly templates, where it marks a place for your photo. |
| Empty state | Never empty. | Shows a gray checkerboard until it has a picture, or shows the page image if the page has one. |
| Fit options | Cover, Contain, Fill | Set by the template. |
| Paper treatments | Edge and frame, tape | Not available |
| Bitgrain effects, filters, shadow and glow | Yes | Yes |
To put your own photo into an image slot, select it and click choose image (or replace image) at the top of its Appearance section. The picture you choose also becomes the page image, so any other empty slot on that page fills with it too.
For an uploaded image, click the image preview at the top of the panel (Replace image...) to choose another picture. Its position, size, effects and treatments stay the same.
These are the sections of an uploaded image's panel. Image slots have the same sections, minus Format, Edge & frame and Tape.
| Section | Controls |
|---|---|
| Format | Cover fills the box and crops the overflow. Contain fits the whole picture inside the box. Fill stretches the picture to the box. |
| Position & Size | Align buttons, X, Y, W, H, aspect lock, corner radius (0 to 400) and rotation, plus match page to image. |
| Appearance | Opacity, blend mode and eight image filters. See effects and adjustment layers. |
| Image effects | One Bitgrain effect, such as halftone or dither, with its settings. See effects and adjustment layers. |
| Shadow & glow | A drop shadow or an outer glow. |
| Edge & frame | Torn, deckle or perforated edges, with a paper or polaroid border. |
| Tape | Strips of tape on any corner. |
Tip: Hold
Shiftwhile dragging a corner handle to resize without distorting the photo, or turn on the link button next to W and H.
match page to image, under the size fields, resizes the active page to exactly the size of the selected image layer and moves the image to the top-left corner, so the photo fills the page edge to edge. Resize the image layer to the size you want first, then click it.
For a finished piece that keeps a photo's native proportions, add the photo, click match page to image, then build the rest of the design on top.
Click Add shadow or glow to add one to an image layer. Switch between the two modes at the top, and use the minus button to remove it.
| Mode | Settings | Default |
|---|---|---|
| Shadow | X and Y offset (-100 to 100), Blur (0 to 100), color | 0, 8, blur 16, black |
| Glow | Size (0 to 100), color | Uses the same blur and color |
A glow is a shadow with no offset, spreading evenly around the picture. Try a light glow color on a dark page, or a saturated one behind a cut-out.
Uploaded images can be dressed up to look like physical prints: torn from a magazine, trimmed with deckle edges, or taped into a scrapbook. These treatments are generated from a seed, so the same settings always give the same tear.
Turn on Edge & frame with its switch. The defaults are torn edges on all four sides with a 10 pixel white paper border.
| Control | What it does |
|---|---|
| Style | Torn (ragged, ripped paper), Deckle (the soft, wavy edge of handmade paper) or Perforation (a stamp-like punched edge). |
| Frame | Paper (an even border) or Polaroid (a deeper border along the bottom, like an instant photo). |
| Torn sides | Arrow buttons for top, right, bottom and left. Only the sides you pick get the edge treatment. |
| Rough | 0 to 100. How deep and jagged the edge is. Default 50. |
| Detail | 3 to 48. How many bumps run along each side. Default 16. |
| Border | 0 to 60 pixels of paper around the picture. Default 10. |
| Border color | The color of the paper. Default white. |
| Tear pattern | Shuffle tear gives you a different tear with the same settings. |
A shadow or glow works together with Edge & frame. It follows the torn or framed outline, and it is included in the exported file just as it looks on the canvas.
Turn on Tape with its switch to stick strips of tape across the corners.
| Control | What it does |
|---|---|
| Corners | Buttons for top left, top right, bottom left and bottom right. By default two diagonal corners are taped. |
| Color | The tape color. The default is a warm off-white (#f4efe6), like masking tape. |
| Opacity | How see-through the tape is. Default 85%. |
Combine torn edges, a slight rotation and tape for a collage piece, or select several photos and use Scatter into collage to do it all at once. See layers.