Preview Mode

In preview mode, the output of your prompts are CSS diffs. Applying the changes will add CSS overrides in memory.

Workflow

  1. Prompt: With a component selected, select a model and submit your prompt.
  2. Review: The response will be a CSS diff available in the JSX Navigator for review.
  3. Apply: Click the "Apply changes" button to add the CSS overrides to your editor and view them in the browser.
  4. Tweak (optional): Use the CSS editor to finalize your design.
  5. Save or Clear: Use the configurable save button to apply the change to your codebase with editing mode or clear the changes if you want to revert.