Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub

Welcome to gatsby-remark-pintora 👋

Version License: MIT

This plugin adds diagrams using pintora during server-side rendering. So you don’t have to include a runtime dependency of pintora.

Pintora is faster than Mermaid.js in CLI, since you don’t have to start a headless browser to generate images.

🏠 Homepage


In your gatsby project:

npm install --save gatsby-remark-pintora @pintora/cli

How to Use

This plugin processes markdown code blocks. If you have any other plugins which do that such as syntax highlighters, make sure you import this before those plugins.

Add the plugin to your gatsby-config.js.

  plugins: [
      resolve: 'gatsby-transformer-remark',
      options: {
        plugins: [
            resolve: 'gatsby-remark-pintora',
            options: {
              // language: 'pintora',
              // theme: 'default',
              // backgroundColor: '#ffffff',

Now you can use pintora in your markdown:

  :Install Plugin;
  :Make beautiful and structured diagrams;

And it will be replaced with inline svg:

output example



This plugin is inspired by gatsby-remark-mermaid | Gatsby.

This README was generated with ❤️ by readme-md-generator

© 2023 Gatsby, Inc.