Back to Plugins
Markdown to Figma

Markdown to Figma

Convert clean, structured Markdown into polished Figma layouts — fully styled and production-ready.

Plugin Preview

Markdown to Figma preview

About this plugin

Markdown to Figma – Advanced Importer brings powerful GitHub-Flavored Markdown support directly into Figma. It transforms Markdown documents into clean auto-layout frames with proper spacing, hierarchy, and styling.Ideal for design systems, technical documentation, UX specs, product requirements, onboarding docs, and color palettes.The plugin parses headings, paragraphs, inline styles, lists, blockquotes, code blocks, tables, and even detects hex color values like #14392F—automatically generating color swatches next to their values inside tables.Everything is rendered using Figma's auto-layout for a clean, consistent, designer-friendly result.Core FeaturesSmart TypographyHeadings H1–H6 with a consistent type scaleParagraphsInline formatting:BoldItalicStrikethroughInline code (monospace)Automatic text resizing and line-height optimizationAdvanced Table SupportFull GFM-style table parsingAutomatic hex color detection (#14392F, #BEE9B2, etc.)Swatches generated directly in table cellsZebra striping for better readabilityStable auto-layout without collapsing columnsLists & Structural ElementsBullet and numbered listsBlockquotes with styled containerHorizontal rulesFenced code blocks with dark background and monospaceClean Figma LayoutsFull auto-layout vertical flowProper padding, spacing, alignmentThoughtfully minimal designInter and Roboto Mono font supportPerfect ForDesign systemsColor palettes & brand guidelinesUX / UI documentationDeveloper handoffEngineering specsProduct requirementsTech writing workflowsExamplePaste:# Color System## Primary Palette| Name | Hex | Usage || --- | --- | ------ || EGS Main | `#14392F` | Depth, anchor color || EGS Pear | `#BEE9B2` | Buttons, accents |The plugin instantly generates a clean, styled layout with color swatches, proper typography, spacing, and auto-layout.CHANGELOG (v1.0.0)v1.0.0 — Initial ReleaseFull Markdown (GFM subset) importHeading, paragraph, list, and blockquote supportCode blocks & inline codeAdvanced table renderingHex color detection + swatchesProper auto-layout structurePolished default spacing, padding, and typographyKEYWORDSmarkdowndocumentationimportconverterdesign systemdeveloper handofftechnical writingcolor palettehex colortableauto layoutcode blockUX writingGFMspecsCREDITSDeveloped by Sedra RabemanantsoaCTO & Co-Founder — OUIKAMSFind me on LinkedIn: Sedra Rabemanantsoa

Plugin Details

Version1
CreatedDecember 2, 2025
Last UpdatedDecember 2, 2025
CategoryImport & export plugins
CreatorSedra RABEMANANTSOA
Stats16 installs, 3 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • none