Configure HTML Output Settings

Last updated on Oct 10, 2026

Learn how to set slice properties and HTML attributes using the Slice Options dialog box for web export workflows in Adobe Photoshop.

HTML output settings control how Photoshop generates HTML when you export sliced images. Configure slice properties, such as content type, hyperlinks, accessibility attributes, and background colors.

Note

These settings are primarily intended for legacy web workflows that use HTML table-based layouts. Modern workflows typically export images and build HTML separately.

Open the Slice Options dialog box

Select the Slice Select tool.

Double-click the slice you want to customize.

Configure the slice properties in the Slice Options dialog box.

In the Slice Options dialog box, select a slice type from the Type menu, select Image for image content or No Image for HTML text.

Enter a descriptive name in the Name box to override the default numbered naming convention.

Select a background color from the Background menu if you want to fill transparent areas in Image slices or the entire cell in No Image slices.

Select OK.

Note

Background colors aren't displayed in Photoshop. Preview the exported HTML in a web browser.

Add link and browser information for Image slices

Select the slice and double-click it with the Slice Select tool.

In the URL box, enter a relative or absolute URL. Include the protocol (http:// or https://) for absolute URLs.

Enter a frame name in the Target box to control where the linked page opens—use _blank for new windows, _self for the same frame, _parent for the parent frameset, or _top to replace all frames.

In the Message Text box, enter the text you want to appear in the browser's status bar.

In the Alt Tag box, enter descriptive text for screen readers and tooltips.

Select OK.

Configure HTML text content for No Image slices

Select the slice and double-click it with the Slice Select tool.

Select No Image from the Type menu.

Enter your text content in the text box, including HTML tags if needed.

Select the Text Is HTML option to allow HTML formatting.

Choose horizontal alignment: Default, Left, Center, or Right.

Choose vertical alignment: Default, Top, Baseline, Middle, or Bottom.

Select OK.

Select File > Export > Save for Web (Legacy) to generate your HTML file and associated image files. Photoshop creates a complete HTML table structure with your specified settings applied to each slice.

Create stunning images with Photoshop
Edit, retouch, and transform photos with the industry-leading creative tools you know and love.

Open the app

View and edit Slice properties

PDF does not open automatically after saving on a Mac

Learn

Learn with step-by-step video tutorials and hands-on guidance right in the app.

Community

Join discussions, find answers, learn from experts, and share your knowledge.

Adobe Home

Access your favorite Creative Cloud apps, services, file management, and more.