Mermaid in Figma
Enable to use Mermaid code in Figma
Plugin Preview
About this plugin
The plugin can create Mermaid chart images and add it to your Figma files.How to Use[ Preparation ]Write your Mermaid code.Create a text object with your code.[Mermaid in Figma]Run the PluginSelect the text object and click [ Import text ]Click [ Preview ]Click [ Export ]. The plugin will draw the image in your file.OptionsExport-Width: set the width. The width is the width of the exported image.Scale: set the export scale. If you got an error "Image is too large", please set the small scale. (Please be careful the image could be blur when the scale is too small).Background: (default: transparent)You can set the background color.Default is transparent, which I thought is flexible."Use HTML tags": enable to use HTML tags in your code.Some types (ex. flowchart) can use HTML tags like "" and change style.Please be careful that Markdown can be disabled if this option is set as true.What the plugin can't do[ Types of charts ]ZenUML - betaSankey - betaFont Awesome icons[ Major error ]"Image is too large"[ Others ]Using
© 2026 Figma Plugin Hub. All rights reserved.