AI Image

Whimsical Diagrams

API Documentation

Whimsical Diagrams embraces the finesse of advanced technology to seamlessly create, view, and edit both flowcharts and mind maps. Tailored to cater to users' preference, it employs Mermaid syntax for flowcharts and Markdown bulleted format for mind maps, providing an easy-to-use platform for effortlessly piecing together concepts irrespective of complexity. The tool has a unique feature of enabling multiple branches in flowcharts, necessitating orbits of logic and creativity. An engaging aspect of Whimsical Diagrams is its robust API integration feature which sends requests to Whimsical, returning a cleanly rendered image with an appropriate title, bringing an added level of professionalism to your diagrams. Additionally, it comes equipped with a response-handler that renders the diagram image with an optional link beneath it for detailed viewing or editing on Whimsical. Reliability is a premium attribute for Whimsical Diagrams, shown through its error-detection feature for Mermaid syntax, ensuring the success of every render request. This tool is truly a confluence of simplicity, efficiency, and reliability, having carved its niche in diagram creation and editing.




Example Prompts


"Create a flowchart with this Mermaid code: `graph TD; A-->B; A-->C; B-->D; C-->D;`"


"Generate a flowchart with the title 'Project Plan' and the following mermaid syntax: `graph LR; A(Start) --> B{Is it working?}; B -->|yes| C(Keep doing); B -->|no| D{Can you fix it?}; D -->|yes| E(Well done); D -->|no| F(Trash it!);`"


"I need a mindmap with this markdown bullet list: `- Project\n - Task


"Render a mindmap titled 'Meeting Agenda' using this markdown: `- Introduction\n - Welcome\n - Objectives\n- Main Discussion\n - Topic


"Please create a flowchart from this Mermaid code: `graph TD; Start --> Stop`"


"Create a mindmap for my study plan. Here's the markdown: `- Study Plan\n - Math\n - Algebra\n - Geometry\n - Science\n - Physics\n - Chemistry\n - Language\n - English\n - Spanish`"


"Generate a mindmap from this markdown bullet list: `- Shopping List\n - Groceries\n - Fruits\n - Vegetables\n - Stationery\n - Pens\n - Notebooks`"


"I'd like a flowchart with this Mermaid syntax: `graph LR; A-->B; B-->C; C-->A;`"

Description for AI


Help the user to create a delightful and insightful diagram.

The diagram should be a flowchart or a mind map. Do not describe the diagram or provide the diagram source code. Just show the diagram to the user.


For flowcharts, send Mermaid syntax to Whimsical. For example:

graph TD
A[Start] --Connection--> B[End]

The flowchart should include multiple branches if possible.

Avoid using parentheses in the mermaid as this will cause an error when rendering the diagram.

Mind maps

For mind maps, send a Markdown bulleted format to Whimsical. For example:

Title: Main topic

  • Topic 1
    • Subtopic 1-1
      • Subtopic 1-1-1
  • Topic 2
  • Topic 3

API request to Whimsical

You should provide an appropriate title for the diagram. Whimsical will return a rendered image.

Handling the API response

The response will contain an image of the diagram, and a link to edit the diagram in Whimsical.

You should render the diagram using an inline image. Display the link below the image. The link text should be "View or edit this diagram in Whimsical.". Make sure this text is part of the link.

If you get a Mermaid rendering error, you should revise the diagram and make sure it is valid Mermaid syntax.

Similar Plugins and Alternatives