Digram

Magician, a Figma plugin for AI icon, image and copy generation plus layer auto-renaming; the team was acquired by Figma.

  • Popularity
  • UI Design
  • Free tier
No preview available

At a glance

  • Free tierPartial
Pricing

The Magician plugin offers a free version with basic features available for free experience; full functionality requires a paid subscription.

Pricing changes over time; check the official site

Figma is currently the most widely used UI design tool globally, with the vast majority of internet product design work taking place within it. However, Figma itself is a design tool, not an AI tool—drawing layers, dragging components, and adjusting styles all require manual effort from designers. Diagram changes part of this workflow: it brings AI capabilities directly into Figma, allowing AI to assist designers where they work, rather than requiring them to leave Figma to "use AI" in another tool before returning.

What is Diagram?

Diagram is a company focused on integrating AI capabilities into design tools. Its core product is Magician, a Figma plugin that allows designers to use AI-powered icon generation, image generation, copy filling, and automatic layer renaming directly within Figma.

In 2023, Figma officially acquired Diagram, bringing the team under its umbrella. This acquisition sent a clear signal: Figma believes that AI-assisted design is the core direction of the future, and Diagram is one of the teams that has moved earliest in this direction with the strongest technical accumulation. After the acquisition, Diagram’s technical capabilities began to gradually integrate into Figma’s native features, which is now known as Figma AI.

Deep Dive into Magician’s Core Features

AI Icon Generation

In traditional Figma workflows, if you need an icon, you go to the Figma Community to find an icon library or search on sites like IconFinder or Flaticon. Once found, you must import it; if you can’t find one, your work stalls. Magician’s icon generation solves this problem:

You can input a description directly in Figma, such as "a thin-line style icon representing 'data sync'," and the AI will generate the corresponding vector icon, outputting it in SVG format for direct editing within Figma.

The value of this feature lies in eliminating the step of "going out to find icons," which interrupts design flow. When designers are building interfaces in Figma and encounter a need for an icon, they no longer need to pause work to search elsewhere; they simply describe, generate, and continue working.

Icon styles can be controlled via description—linear icons, solid icons, colored icons, or specific styles—and the AI will understand and generate the corresponding aesthetics.

AI Image Generation (Placeholder Images for Designs)

In Figma designs, there are many places that require images: user avatar placeholders, product image displays, article cover images, etc. The traditional approach is to use gray placeholder boxes or find some stock photos to make do with, but this results in poor design presentation, making it difficult for clients to visualize the real product feel.

Magician can generate AI images directly within Figma’s image frames. Select an image placeholder layer, describe "outdoor sports scene, sunlight, young people, positive atmosphere," and the AI will generate the corresponding image and fill it in. With realistic content in every image spot in the design, the persuasiveness of the overall mockup increases significantly.

This is particularly valuable when presenting design directions to clients—the reaction and quality of feedback differ greatly between showing a highly realistic mockup versus a wireframe full of gray placeholder boxes.

AI Copy Filling

Placeholder text in Figma is usually either "Lorem ipsum" or random text typed by the designer, which differs significantly from real product copy. Magician can generate more meaningful example copy based on the type of text element:

  • Button text: Generate appropriate CTA copy ("Get Started," "Try Free for 14 Days")
  • Description paragraphs: Generate introductory text that matches the product tone
  • Product names: Generate example product names suitable for the category
  • Headlines: Generate titles suitable for the corresponding page location

With more realistic copy, the design presentation feels closer to the real product, and the actual effect of typography can be verified more accurately.

Intelligent Layer Renaming

This is an unassuming but essential feature for every Figma user. After working in Figma for a while, the Layers panel often fills up with meaningless names like "Frame 1," "Rectangle 47," or "Group 13," requiring designers to spend significant time manually organizing them before delivering designs.

Magician can analyze layer content and automatically provide semantic names: a frame containing navigation menu content is renamed "Navbar," a primary CTA button is renamed "Button_Primary_Orange," and so on. For designers who need to deliver clean designs to development teams, this feature saves considerable time.

Design Variant Generation

Generate multiple variant versions with different styles or content based on a single design foundation to quickly explore design directions. There is no need to manually copy and modify each one; AI helps expand possibilities.

The Significance of Figma’s Acquisition

Figma’s decision to acquire Diagram in 2023 was driven by clear strategic considerations: AI-assisted design will become a standard capability for design tools, as fundamental as spell check and auto-alignment are today. Figma did not want to fall behind in this wave of change, and the Diagram team had the deepest technical accumulation and most practical experience in "applying AI to design workflows."

Progress since the acquisition:

  • The Diagram team joined Figma and began deeply participating in the development of Figma AI features.
  • Figma launched its Figma AI feature set in 2024, which includes many functions highly overlapping with Magician’s capabilities.
  • The necessity of Magician as an independent plugin is decreasing, but its technical approach and functional design have deeply influenced Figma’s product direction.

For users, this means that many AI features that previously required installing plugins can now likely be found directly in Figma’s native interface, eliminating the need to install Magician separately.

Comparison with Other Design AI Tools

Comparison with Creatie.ai: Creatie.ai is a tool for generating UI from scratch, outputting complete interfaces from a single text description; Magician/Diagram is an auxiliary tool embedded in Figma, helping designers already working in Figma improve efficiency. They address different stages of the problem.

Comparison with Galileo AI: Galileo also generates UI interfaces from text descriptions but is not a Figma plugin, making it suitable for scenarios where you start generating interfaces from scratch; Magician is better suited for designers who already have a Figma workflow, supplementing AI capabilities rather than replacing the entire workflow.

Comparison with Figma AI (Native): The relationship between these two is unique—Diagram’s technology is being integrated into Figma AI, shifting their relationship from competitors to a unified entity. For users, the significance is that Figma’s native AI features will become increasingly powerful, allowing you to access these capabilities by simply upgrading Figma.

Comparison with Adobe XD + Adobe Sensei: Adobe has integrated Adobe Sensei AI capabilities into design tools like XD, representing a competitive direction to the Figma ecosystem. Choosing between the Figma and Adobe ecosystems is fundamentally a question of designer tool preference; both directions are actively integrating AI capabilities.

Who Is This For?

Heavy Figma Users: If you spend most of your day working in Figma, Magician’s various features offer direct efficiency value, particularly icon generation and renaming, where the accumulated time savings can be substantial.

Designers Needing to Quickly Create Demo Mockups: When presenting product interfaces to clients or investors, AI-generated placeholder images and example copy make mockups more persuasive, improving presentation outcomes.

Designers Following Figma AI Developments: Understanding Diagram/Magician is understanding the predecessor and technical direction of Figma AI, providing reference value for designers interested in the development trends of design tools.

Efficiency Optimization for Design Teams: Batch layer renaming and rapid placeholder image generation save practical time in large-scale design projects.

Pricing

The Magician plugin offers a free version with basic features available for free experience; full functionality requires a paid subscription. Since Diagram has been acquired by Figma, pricing strategies and future feature integration methods may change; it is recommended to refer to the latest information on their official website.

Diagram’s acquisition is a microcosm of the broader trend of AI integration in design tools: as design tools increasingly integrate AI capabilities, designers’ daily work will gradually change. It is not about AI replacing designers, but rather those who skillfully use AI tools achieving significantly higher efficiency than those who do not. Diagram and Magician represent exactly this direction of convergence.