Import from Magic Patterns
Import Magic Patterns designs into Alloy for editable prototypes. Capture AI-generated patterns and transform them. Start prototyping now.
Introduction
Alloy makes it easy to import patterns from Magic Patterns and transform them into fully editable prototypes that match your existing product's design system.
Whether you're testing new features or exploring UI patterns, Alloy lets you capture Magic Patterns designs and modify them to align with your product's look and feel.
Capture screen from Magic Patterns (recommended)
The Capture Screen method is the fastest and most accurate way to import your Magic Patterns design into Alloy. It uses the Alloy Browser Extension to replicate your pattern with pixel-perfect precision.
Steps:
- Download and install the Alloy Browser Extension
- Open your Magic Patterns design in a supported browser (Chrome, Arc, Edge, Brave)
- Click Capture Screen in the Alloy extension
- Wait a few moments while Alloy recreates your pattern inside the editor
- Start prototyping using:
- Chat interface – type natural language prompts to make changes
- Visual editing – select specific components and update them instantly
Best for:
- Preserving the exact design and layout from your Magic Patterns creation
- Capturing patterns that match your existing design system
- Maintaining component structure from Magic Patterns' AI generations
Upload your Magic Patterns link
If your Magic Patterns design is publicly accessible, you can import it directly into Alloy using the Upload Link feature.
Steps:
- Copy the public URL of your Magic Patterns design
- Paste it into Alloy's Upload Link field
- Alloy will generate a lifelike recreation of your pattern
- Edit the design instantly using chat prompts or visual editing
Best for:
- Quickly recreating Magic Patterns designs without installing the extension
- Simple, static pattern imports
- Testing multiple pattern variations
Tips for Magic Patterns imports
- Ensure your Magic Patterns design is fully rendered before capturing
- Magic Patterns' real-time multiplayer designs import as static prototypes
- Review imported patterns and adjust to match your product's design system
- Use Alloy's design tokens to maintain consistency with your existing app
- Consider capturing multiple patterns to build a comprehensive prototype