Visit VercelHome

Code editing

Edit v0's code output and target inline code generation.

Basic editing

Code editor window
  1. Switch to Code view: Click the "Code" tab next to the preview to see the generated code
  2. Edit the code: The code is highlighted and ready for editing - simply click and type to make changes
  3. Use find and replace: Press Cmd+F (Mac) or Ctrl+F (Windows/Linux) to search for specific text
  4. Save your changes: Click the save button or use Cmd+S / Ctrl+S to save your modifications

Inline code generation

You can target any code in the editor and ask v0 to make changes to it. Press Cmd+K to open the inline code generation prompt.

Editor features

Code with syntax highlighting and line numbers
  • Syntax highlighting: Code is properly highlighted based on the file type
  • Line numbers: Easily navigate through your code with line numbers
  • Find and replace: Quickly locate and modify specific code sections
  • Auto-save: Changes are automatically saved as you work

Tips

  • Use the find feature to quickly locate specific functions or variables
  • The editor supports all standard keyboard shortcuts for editing
  • You can edit multiple files in a project by switching between them in the file tree

Figma

Turn your Figma files into high-fidelity UIs.

Design mode

Design mode is a new way to design your app.