> Portal Navigation:
>
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt
## Resource: Create and Manage Design Presets
## Article: Creating and Managing Design Presets
## Article Link: https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-design/create-and-manage-design-presets.md
## Article Content:
# Create and Manage Design Presets
**Editor compatibility**
Wix Blocks apps aren't supported in the Wix Harmony editor. Existing Blocks apps remain available for purchase on the Wix App Market for Wix Editor and Wix Studio sites. To learn more, see [About Wix Harmony and Blocks](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/about-wix-harmony-and-blocks.md).
Create multiple designs for the same widget. When you create design presets for a widget, its functionality and data remain the same, while the way it looks can change a lot. You can also use presets to create different designs for different viewports, like desktop and mobile. Learn more [about design presets](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/widget-design/about-design-presets.md) in Blocks.
Examples:
To see examples of design presets, open the following templates and browse through the app widgets. Also, take a look at the widgets' [installation settings](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/deploy-and-manage-blocks-apps/configure-blocks-installation-settings.md#preset-visibility-and-images).
- [Banner](https://dev.wix.com/apps-templates/template?id=1b7db962-6230-46bf-b908-d988ef640238&http_referrer=documentation)
- [Repeater](https://dev.wix.com/apps-templates/template?id=a4a7246f-4644-48ce-81e7-2a86aa74d9e5&http_referrer=documentation)
- [Events Map](https://dev.wix.com/apps-templates/template?id=f086effa-64b8-4c8b-a5c8-61c3a7548af7&http_referrer=documentation)
- [Calculator Form](https://dev.wix.com/apps-templates/template?id=3ccb81da-dff8-43fd-95c8-620563624e2b&http_referrer=documentation)
- [Recipe list](https://dev.wix.com/apps-templates/template?id=512a7d8a-1666-40c2-9586-25874d2f69b4&http_referrer=documentation)
**To create and manage design presets in Blocks:**
1. Open the widget you want to design.
2. Click **\+ Add** in the **Design Presets** panel.
3. Click the **ֿMore Actions** icon  to rename, duplicate or delete a preset. Note that if you only have one preset, you cannot delete it.

4. To preview your design presets, click **Preview** > **Test Design Presets**.
## Make Changes Per Preset Versus Global Changes
Some changes you make in one preset impact only the current one, while others impact all of them. As a rule of thumb, design changes are per-preset, while structure or data changes are global. Here's a guide to help you track what happens when.
Changes that impact all presets
* Add an element from the add panel.
* Duplicate, copy, cut and paste an element.
* Delete an element.
* Hide an element on all other presets (click the **More Actions** icon  in the element's action bar and then click **Display** -> **Hide on all other Presets**).
* Reparent an element.
* Group and ungroup elements.
* Manage the items in a repeater (reorder).
* Stack, unstack, add to stack and detach from stack (however, changing the order of stack items impacts current preset only).
* Text: change text content.
* Text - structural changes: theme (such as Heading 1 or Paragraph 2), a link, bullets, numbering, indentation, text direction and heading tag.
* Replace a decorative shape (icon).
Changes that impact only your current preset
* Resize a widget.
* Set widget overflow content options, position, design and adjust options.
* Hide an element in this preset (click the **More Actions** icon  in the element's action bar and then click **Display** -> **Hide on this Preset**).
* Change an element's design and layout.
* Change an image's focal point.
* Hide, show and reorder widget layers.
* Grids: change the number of rows or columns, define row and column size, set gaps, move elements between cells (change grid areas).
* Flexboxes: set display type, item properties, auto-wrap, margins, direction and proportions.
* Reorder stack layers.
* Text - design changes: font, scaling, size, bold, italic, underline, color, highlight, alignment, line spacing and character spacing.
## Define Preset Visibility in the Widget Installation Settings
When users install your widget, you can allow them to select a preset from the **Add to Site** panel and later switch between presets using the **Presets**  button in the widget’s action bar. You can control which presets appear by configuring their visibility in the [installation settings](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/deploy-and-manage-blocks-apps/configure-blocks-installation-settings.md#preset-visibility-and-images).
The Add to Site Panel

The Presets Panel


## Change Presets According to Viewport
You can create different presets for different viewports, such as vertical layouts for mobile. Wix Studio users can switch between desktop, tablet, and mobile views, while Wix Editor users can switch between desktop and mobile. When users select a viewport, they can change the preset using the **Presets**  button, but presets for other viewports remain unchanged. You can also set a default preset for mobile in the [installation settings](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/deploy-and-manage-blocks-apps/configure-blocks-installation-settings.md#preset-visibility-and-images).
