An artboard in Photoshop is a movable, resizable container that acts as an individual canvas within a single document. It allows designers to create multiple layouts or design variations side by side, each with its own size and content. Artboards are ideal for web layouts, app screens, banners, and print materials, enabling efficient exporting of each board as a separate file. To use artboards, select the Artboard Tool (Shift O), choose preset or custom sizes, and click-drag to place them on the canvas. They can be renamed in the Layers panel for better organization, and layers are grouped per artboard to keep the workspace clean. Benefits include faster exporting via File > Export > Artboards, improved project organization, easier design comparisons, and clearer handoff to developers. Key tips: Canvas Size affects the entire document, artboards can be rearranged but shouldn’t overlap unintentionally, some tools behave differently across boards, and older Photoshop versions may not support artboards properly.
Artboards in Photoshop are like individual canvases within a single document. Think of them as separate pages or frames where you can design different elements — perfect for creating multiple versions of a layout, designing app screens, or organizing different parts of a project all in one file.

What Exactly Is an Artboard?
An artboard is essentially a movable, resizable container that holds your design content. Unlike traditional Photoshop documents where everything lives on a single canvas, artboards let you have multiple isolated workspaces side by side. They’re especially useful when working on web layouts, mobile designs, banners, or print materials that need to be exported separately.

You can create as many artboards as you want in a document and arrange them horizontally or vertically. Each one can have its own size and content, and when you export, you can choose to export each artboard as its own file automatically — which saves a lot of time compared to manually saving each version.
How Do You Create and Use Artboards?
To start using artboards:

- Choose the Artboard Tool (Shift O), or select it from the toolbar under the Move Tool.
- In the options bar at the top, you can choose from preset sizes (like common phone or tablet dimensions) or set custom width and height.
- Click and drag to place your first artboard on the canvas.
Once you've got more than one, you can rename them in the Layers panel for better organization. This makes it easier to keep track if you're working on several variations or screens.
Also, layers are grouped per artboard, so when you select an artboard, only its related content shows up — helping keep things clean and focused.
Why Are Artboards Useful?
They bring a few key benefits that make life easier:
- Efficient exporting: Export each artboard as a separate file with one command (File > Export > Artboards).
- Better organization: Keep multiple designs together without opening multiple files.
- Design variations: Try out different color schemes, layouts, or UI elements side by side.
- Handoff clarity: When handing off to developers, clearly labeled artboards help explain how each screen or component should look.
This makes them especially popular among UI/UX designers and anyone doing multi-page or multi-device design work.
A Few Tips to Keep in Mind
Here are a few small but important things to remember when working with artboards:
- If you use the Canvas Size option, it affects the entire document, not just one artboard.
- You can rearrange artboards by dragging them around — just make sure they don’t overlap unless you want them to share space.
- Some features like Content-Aware Fill or Auto-Select behave differently across artboards, so double-check how selections work.
- If you’re sharing your file with someone who uses an older version of Photoshop, artboards might flatten into layers — always confirm compatibility.
Using artboards takes a little getting used to if you’ve been working with standard documents all along, but once you do, it’s hard to go back. It’s a simple feature that brings a lot of flexibility and efficiency — especially if you're designing for digital platforms.
The above is the detailed content of What are artboards in Photoshop. For more information, please follow other related articles on the PHP Chinese website!

Hot AI Tools

Undress AI Tool
Undress images for free

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics

Mastering Photoshop shortcut keys can significantly improve work efficiency. 1. Zoom and Navigation: Z key activates the zoom tool, Space bar Drag the quick pan canvas, double-click Z key to adapt the image to the window size, Ctrl/Cmd/-adjust the zoom level; 2. Layer management: Ctrl Shift N creates a new layer, Ctrl G group, Ctrl E merges layers, Shift [or] moves the layer level, Ctrl Click on the layer thumbnail to quickly select content; 3. Select and brush adjustment: M and L to switch rectangular marquee and lasso tools respectively, Shift adds/Alt to subtract selections, [or] adjusts the brush size, Shift [or] adjusts the hardness, so as to achieve efficient editing and smooth operation.

Repairing old photos can be achieved through key steps in Photoshop. The first is scanning and preliminary adjustment, including high-resolution scanning, cropping images, rotation correction and brightness/contrast adjustment; the second is to remove scratches and stains, use the imitation stamp tool to deal with large-area damage, repair tools to deal with small scratches, and pay attention to low transparency overlay and layering operations; the third is optional coloring and color tuning, and use the "hue/saturation" adjustment layer to increase retro tone; the last is to polish and output, check details, adjust sharpness, confirm resolution and select a suitable format to save. The entire process requires patience and meticulousness, especially when dealing with key parts such as the facial features of the characters.

LayerMasks and VectorMasks are used in Photoshop with similar uses but different principles. LayerMasks is based on pixels and uses grayscale values to control the display and hiding of layer areas. It is suitable for photo detail editing, soft transition effects and fine brush adjustments, but zooming in may lead to jagging; VectorMasks is based on vector paths and shapes, and has resolution irrelevant resolution. It is suitable for graphics that require clear edges such as logos, icons or text frames, and can be scaled losslessly; the selection is based on the content type (photo or graphics), whether the size needs to be greatly adjusted, and the required edge effects (soft or sharp), and sometimes combined use can give full play to their respective advantages.

The key to creating a custom gradient in Photoshop is to master the use of the gradient editor. 1. First select the gradient tool (shortcut key G), click the top preview bar to open the "Gradge Editor"; 2. Click "New" in the editor to start customization, and you can also modify the style in the built-in gradient library; 3. Set color transition by adding, deleting and dragging the color slider, and double-clicking the slider to select specific colors; 4. Adjust the opacity stop point to control the transparency changes, click the diamond icon to add the transparency node; 5. Select linear, radial and other types in the gradient tool options to match design needs, and you can get started quickly after you are proficient.

Raster and vector graphics have different uses in Photoshop, and understanding their differences can help design decisions. Raster graphics are made of pixels and are suitable for photos and complex textures, but the scaling will blur; Vector graphics are based on mathematical formulas and can be scalable without loss, suitable for logos, icons and clear line art. Use the shape tool in Photoshop or importing EPS/PDF files to create Vector graphics, but loses scalability once rasterized. Using Raster includes editing photos, applying filters, or creating textured artworks; using Vector includes designing logos that need to be scaled, adding clear text or shapes. Both can coexist in the same file, but need to be cleared

TocreateandmanipulatevectorshapesinPhotoshop,usetheShapeToolstodrawvectorpathsonshapelayers,editanchorpointswiththeDirectSelectionTool,combineorsubtractshapesusingpathoperations,andrasterizewhennecessary.First,selectthedesiredshapetool—Rectangle,Elli

ToselectaspecificcolorrangeinPhotoshop,usetheColorRangetool.1.GotoSelect>ColorRangeandclicktheeyedropperonthedesiredcolor.2.AdjusttheFuzzinessslidertocontrolselectionbreadth.3.AddmoresampleswithShift-clicks.4.EnableLocalizedColorClustersforcomplex

AnartboardinPhotoshopisamovable,resizablecontainerthatactsasanindividualcanvaswithinasingledocument.Itallowsdesignerstocreatemultiplelayoutsordesignvariationssidebyside,eachwithitsownsizeandcontent.Artboardsareidealforweblayouts,appscreens,banners,an
