# Export > Learn how to export assets and styles from the web app. **URL:** https://www.sketch.com/docs/developer-handoff/export/ | **Last updated:** 2026-02-03 --- You’ll need to enable the **Can download and inspect** option in a document so Viewers can export assets. ## Exporting assets ### Exporting individual assets As well as being able to inspect documents in their browser, developers can export any assets they need, all from the web app. Anyone with View access will need the **Can download and inspect** option checked in their [document permissions](/docs/sharing-and-collaborating/document-permissions/) to export assets. Open a document in the web app and click the **Inspect** icon . From the Inspector panel, click any layer to bring up its properties. Click the **Export as** button to preview your export and choose the resolution, prefix/suffix, and file format. You can add multiple Export options and reset them at any point. Click **Export** to download the assets. ### How to export all assets To export and download assets from the web app, you first need to do the following in the Mac app: - [Make layers, frames or groups in your document exportable](/docs/importing-and-exporting/#how-to-create-and-use-export-presets) or; - [Create Slices to export](/docs/importing-and-exporting/#how-to-use-slices) To export all assets in a document, go to the **Document Details** panel and select **Export Assets**. This will generate a Zip file containing the assets. When your assets are ready, click the **Download Assets (ZIP)** link that appears to download them. If the **Export Assets** button in the web app is greyed out or individual assets don’t show any export options, it’s because there aren’t any layers or frames set as exportable in the document. You’ll need to add slices or set layers, groups or frames as exportable in the Mac app first. Depending on the total size of the assets you’re exporting, you may not be able to download all assets straight away. If that happens, you’ll receive both an email notification as well as a notification in the [Updates page](/docs/sharing-and-collaborating/commenting/#viewing-comment-notifications) to let you know that your assets are ready for download. ## Design token exports If your document or Library has [Color Variables](/docs/symbols-and-styles/color-variables/), [Text Styles](/docs/symbols-and-styles/text-and-layer-styles/text-styles/), or [Layer Styles](/docs/symbols-and-styles/text-and-layer-styles/layer-styles/), you can automatically generate design token exports in CSS or JSON formats that stay up to date with any changes you make. To generate a design token export, click the **Document Details** icon on the upper right, then click **Export Design Tokens** in the Document Details panel. Alternatively, click the on the upper right of the toolbar and select **Export Design Tokens** from the menu. In addition, you can also generate design token exports from the **Components** view from the sidebar on the bottom left. ### Design token export settings In the **Export Design Tokens** modal you have the option to export Color Variables, Layer Styles and Text Styles. Use the drop-down menus to switch between CSS or JSON formats, and color formats (RGB, hex or HSL). > **Note:** You can download color tokens as either CSS or JSON, but Layer and Text Styles will only work in JSON format. As you change export settings, you’ll see a preview of the code in the right-hand panel (which you can copy if you want to use it right away). Once you’re ready to export, click the **Download Tokens** button to save your design token export locally. ### Sharing design token exports using a URL To generate a public URL for your design token exports — useful for referencing in development projects — use the drop-down menu to select from three options: - **Enabled for latest document update**: Always links to the latest update of the document’s Color Variables, Text and Layer Styles - **Enabled for latest starred version**: Always links to the latest [starred](/docs/sharing-and-collaborating/sharing-and-viewing-documents/creating-starred-versions/) version of the document. If the document has no starred updates, it will link to the most recent update instead - **Disabled**: Any links you shared will no longer work. > **Note:** Only Editors and Admins can enable or disable links, while Viewers can copy and view any enabled link. ### Integrating design token exports with development projects You can use public design token export URLs with tools like [Storybook](https://storybook.js.org) to bring in the latest changes, although we don’t recommend adding them directly to a production environment. Here’s a [sample project](https://github.com/sketch-hq/design-tokens-example) to show you how you could integrate design token exports with your development projects. You can also find more information on working with the Amazon Style Dictionary format we use for JSON color tokens in [their documentation](https://github.com/style-dictionary/style-dictionary#design-tokens).