# Wonder

- [What is Wonder](https://wonder.design/docs/what-is-wonder.md): Wonder is a canvas where you ideate with AI to get to something you actually love. Bring in existing designs from Figma or code, create variations, play with layouts, and wonder! The best part? What you design is code, so what you see is exactly what gets shipped.
- [Wonder MCP](https://wonder.design/docs/wonder-mcp.md): Connect Wonder to your coding agent over MCP so design changes and code changes stay in sync.
- [Design with AI](https://wonder.design/docs/design-with-ai.md): Prompt Wonder to generate, explore, and refine designs directly on the canvas.
- [Generate images and vectors](https://wonder.design/docs/generate-images-and-vectors.md): Generate scalable vector graphics from the Wonder AI chat, powered by Quiver.
- [Shaders](https://wonder.design/docs/shaders.md): Add rich, animated backgrounds and effects from Wonder's shader library
- [Variables](https://wonder.design/docs/variables.md): Define, import, and manage design tokens for color, typography, and spacing, kept in sync with code.
- [Icons](https://wonder.design/docs/icons.md): Add, manage, and reuse icons in your Wonder files.
- [Bring your code onto the canvas](https://wonder.design/docs/bring-your-code-onto-the-canvas.md): Connect a GitHub repository to design with your real components, tokens, icons, and views.
- [Import from Figma](https://wonder.design/docs/import-from-figma.md): Paste existing Figma frames straight as editable layers onto the Wonder canvas
- [Wonder Capture](https://wonder.design/docs/wonder-capture.md): Capture any webpage with Wonder Capture and paste it onto the canvas as editable layers.
- [Preview sign-in](https://wonder.design/docs/preview-sign-in.md): How a preview signs your app in, the one setting it might ask you for, and what has to happen in your browser instead.
- [Support](https://wonder.design/docs/support.md): How to get help with Wonder, report a problem, and reach the Wonder team.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.