Build a Landing Page

Internet Design to React Component

How to Collaborate and Use Projects in Magic Patterns

Platform Overview

Watch how we use Magic Patterns to create designs.

Basic Video Tutorials

Magic Patterns

The AI prototyping platform for product teams.

Welcome to Magic Patterns

Frequently Asked Questions about Magic Patterns

View the latest updates and releases on Magic Patterns

Changelog

The best language to use when writing your prompt on Magic Patterns

Prompting Dos and Don'ts

Use presets to create your own saved custom theme or style.

Consistent Styles

Idea to functional frontend with nothing but words.

How to Prompt

Watch how we use Magic Patterns to create a landing page.

Build a Landing Page (16 mins)

Watch how we use Magic Patterns to recreate an existing design.

Build an Existing Design (6 mins)

Watch an overview of features and how to use Magic Patterns.

How to Use (11 mins)

Case Studies

Community

YouTube

Start designing

Talk to us

Export your designs to Figma, sync back and forth with Github, or host on a custom domain.

Overview of Exporting

Generate designs and then export them to Figma.

Export to Figma

Generate designs and then sync them to Github.

Sync to Github

Host on a Custom Domain

To download a `.zip` of all the code, click the Export button in the top right corner of the screen.

Download Code

How to share Magic Patterns chats and projects

Sharing with Teammates

Projects in Magic Patterns are an infinite canvas, like Figma. Use them to organize your designs.

Using Projects

Getting around the Magic Patterns canvas.

Navigating

Start from scratch or import an existing design.

Create your first screen

References are a powerful way to add context to your prompts.

References

Link together screens and get an embeddable prototype.

Prototyping

Prompt templates

How to share designs created in Magic Patterns projects

Sharing designs in projects

Bring your custom branding and design system into Magic Patterns

Overview

Get inspiration from any website, then edit with AI

Import existing designs

Introduction

Learn how to replicate an existing product

Your First Prototype

Improving Your Design

Prompting Techniques

Collect customer and stakeholder feedback directly in Magic Patterns

Collecting Feedback

Leverage these workflows to prototype 5x faster

Team Workflows

Acceptable Use Policy

Privacy Policy

Terms of Service

Overview of Magic Patterns for Enterprises

Enterprises

Magic Patterns' security model includes many considerations and initiatives

Security

How to get started with the Magic Patterns API

API Product Overview

Creates a new design based on the provided prompt and optional images. This version supports both default and custom preset configurations.

Overview

Tips and Tricks

Features

Learn: Magic Patterns University

Security & Legal

API

Basic Video Tutorials

Build a Landing Page

Internet Design to React Component

How to Collaborate and Use Projects in Magic Patterns

Platform Overview

Overview

Tips and Tricks

Features

Learn: Magic Patterns University

Security & Legal

API

​Build a Landing Page

​Internet Design to React Component

​How to Collaborate and Use Projects in Magic Patterns

​Platform Overview

Build a Landing Page

Internet Design to React Component

How to Collaborate and Use Projects in Magic Patterns

Platform Overview