Skip to main content
Entry point: the palette icon in the middle of the top navigation. Click it and the current page becomes fully editable in the visual editor. With editable design in superun, you edit the whole page WYSIWYG: select any element to change it directly, or use prompts to fine-tune layout and style — no code required.

Credits

  • Boxify (structuring the page into a box model / actionable groups) consumes credits.
  • Other edits (text, color, spacing, typography, alignment, radius, shadows, image replacement, and so on) are free.

When to use editable design

Use it for:
  • Copy changes and localizing placeholders
  • Font, size, weight, letter/line spacing
  • Color themes and button/link/section colors
  • Layout and grid (Flex/Grid), alignment/distribution, auto layout
  • Spacing (padding/margin), radius, shadows, borders
  • Responsive breakpoints (desktop/tablet/mobile)
  • Replace/crop images and icons; illustration placeholders
  • Component-level tweaks and state styles (hover/active/disabled)

How to access and use editable design

  1. Click the palette icon in the top navigation to enter editable design
  2. Hover and click to select a target element, or enable Boxify to structure the page (only Boxify consumes credits)
  3. Use the side tools or command panel to edit typography/color/layout/spacing, etc.
  4. For larger changes, use a prompt to apply batch or linked updates (prompts are billed like regular messages)
  5. Click Update prototype to apply changes and refresh the preview and code immediately

superun website

Visit the site to learn more about features and examples.