Skip to main content

Power Usage

Vivid has in-built features outside the code pane and command palette to make styling even faster from the browser.

New Components​

Vivid also lets you create new empty divs when building from scratch. You can insert new components by typing > into the command palette (or by hitting ⌘ShiftK). You can choose to insert a new component as a parent, child, or sibling of the currently selected component.

Remove Styles​

You can remove styles by typing -- into the command palette. You can preview your components with various styles removed by scrolling.

Copy Styles​

Vivid lets you copy styles from components you've already designed. Select the source component and hit ⌘C (Windows/Linux:Ctrl) to copy styles. Select the target component and hit ⌘V (Windows/Linux:Ctrl) to paste styles.