Onlook User Guide
This guide will help you get the most out of Onlook as a designer working with React and TailwindCSS projects.
Basic Concepts
Onlook provides a visual interface for editing React components while automatically generating the corresponding code. Key concepts include:
- Visual Editor: Edit your components visually, similar to design tools like Figma
- Live Code Sync: Changes you make visually are immediately reflected in the code
- AI Assistance: Use AI to help generate and modify components
- Layers Panel: Navigate the component hierarchy
- Style Editor: Modify Tailwind styles through a visual interface