Convert Markdown to Image | MD to JPG, PNG, BMP, GIF, TIFF

If you need to preview a Markdown file, you can convert it to image formats. Using the Aspose.HTML class library, you can easily convert Markdown into JPG, PNG, BMP, GIF or TIFF files with just a few lines of code!

This article provides information on how to convert Markdown to Image formats using the Aspose.HTML API. You will learn about the supported conversion scenarios and consider C# examples to illustrate them. Also, you can try an Online Markdown Converter to test the Aspose.HTML API functionality and convert Markdown on the fly.

Online Markdown Converter

You can convert Markdown to other formats with Aspose.HTML for .NET API in real time. Please load Markdown from the local file system, select the output format and run the example. The save options are set by default. You will immediately receive the conversion result as a separate file.

Code example in C# to convert document formats
Input file
Upload a file you want to convert
Output format
Select the target format

If you want to convert Markdown to Image formats programmatically, please see the following C# code examples.

Convert Markdown to JPG in C#

Conversions from Markdown to other formats go through the Markdown to HTML conversion stage. If your scenario is required rendering Markdown document, for instance, to the JPG image file format, the following example demonstrates how that is simple:

  1. Prepare a source Markdown document. In the example, we create a Markdown file from code.
  2. Prepare a path for converted file saving.
  3. Convert Markdown to HTML. Use the ConvertMarkdown(sourcePath) method to save Markdown as an HTML document.
  4. Use the ConvertHTML() method to render the intermediary HTML document to JPG image. You need to pass the HTMLDocument, ImageSaveOptions, and output file path to the ConvertHTML() method for converting HTML to JPG.

If your case is to create a Markdown document from a user string directly in your code and convert it to a JPG file, the following example could help you:

using System.IO;
using Aspose.Html.Converters;
using Aspose.Html.Saving;
using Aspose.Html.Rendering.Image;
...
   // Prepare a path to a source Markdown file
   string sourcePath = Path.Combine(OutputDir, "document.md");

   // Prepare a simple Markdown example
   var code = "### Hello, World!" +
              "\r\n" +
              "[visit applications](https://products.aspose.app/html/family)";
   // Create a Markdown file
   File.WriteAllText(sourcePath, code);

   // Prepare a path for converted file saving 
   string savePath = Path.Combine(OutputDir, "document-output.jpg");

   // Convert Markdown to HTML document
   using var document = Converter.ConvertMarkdown(sourcePath);

   // Convert HTML document to JPG image file format
   Converter.ConvertHTML(document, new ImageSaveOptions(ImageFormat.Jpeg), savePath);

Convert Markdown to JPG using ImageSaveOptions

If your case is to convert an existing Markdown document from a local file system, the following example could help you. You need to follow a few steps:

  1. Open an existing Markdown document. In the example, we load a Markdown file from a local file system (nature.md).
  2. Prepare a path for converted file saving.
  3. Convert Markdown to HTML. Use the ConvertMarkdown(sourcePath) method of the Converter class to save Markdown as an HTML document.
  4. Create a new ImageSaveOptions object and specify the required properties.
  5. Use the ConvertHTML() method to render the intermediary HTML document to JPG image. You need to pass the HTMLDocument, ImageSaveOptions, and output file path to the ConvertHTML() method.

The following code snippet demonstrates how to convert Markdown to JPG using custom save options:

using System.IO;
using Aspose.Html.Converters;
using Aspose.Html.Saving;
using Aspose.Html.Rendering.Image;
using System.Drawing;
using Aspose.Html.Drawing;
using System.Drawing.Drawing2D;
...
    // Prepare a path to a source Markdown file
    string sourcePath = Path.Combine(DataDir, "nature.md");            

    // Prepare a path for converted file saving 
    string savePath = Path.Combine(OutputDir, "nature-options.jpg");
    
    // Convert Markdown to HTML document
    using var document = Converter.ConvertMarkdown(sourcePath);
    
    // Initialize ImageSaveOptions 
    var options = new ImageSaveOptions(ImageFormat.Jpeg)
    {
        SmoothingMode = SmoothingMode.HighQuality,
        HorizontalResolution = 200,
        VerticalResolution = 200,
        BackgroundColor = Color.AliceBlue
    };
    options.PageSetup.AnyPage = new Page(new Aspose.Html.Drawing.Size(600, 950), new Margin(30, 20, 10, 10));
    
    // Convert HTML document to JPG image file format
    Converter.ConvertHTML(document, options, savePath);

The ImageSaveOptions class provides numerous properties that give you full control over a wide range of parameters and improve the process of converting Markdown to JPG format. To learn more about ImageSaveOptions, please read the Fine-Tuning Converters article.

In the above example, we use:

  • SmoothingMode property that sets the rendering quality for this image;
  • HorizontalResolution and VerticalResolution properties that set horizontal/vertical resolution for output images in pixels per inch. By default, these properties are 300 dpi;
  • BackgroundColor property that sets the color that will fill the background. The default BackgroundColor is Transparent;
  • PageSetup property that specifies the page size and margins in pixels.

Convert Markdown to PNG in C#

The following code snippet demonstrates how to convert Markdown to PNG:

using System.IO;
using Aspose.Html.Converters;
using Aspose.Html.Saving;
using Aspose.Html.Rendering.Image;
...
   // Prepare a path to a source Markdown file
   string sourcePath = Path.Combine(DataDir, "document.md");

   // Prepare a path for converted file saving 
   string savePath = Path.Combine(OutputDir, "output.png");

   // Convert Markdown to HTML document
   using var document = Converter.ConvertMarkdown(sourcePath);

   // Convert HTML document to PNG image file format
   Converter.ConvertHTML(document, new ImageSaveOptions(), savePath);

Convert Markdown to BMP in C#

The following code snippet demonstrates how to convert Markdown to BMP:

using System.IO;
using Aspose.Html.Converters;
using Aspose.Html.Saving;
using Aspose.Html.Rendering.Image;
...
   // Prepare a path to a source Markdown file
   string sourcePath = Path.Combine(DataDir, "document.md");

   // Prepare a path for converted file saving 
   string savePath = Path.Combine(OutputDir, "output.bmp");

   // Convert Markdown to HTML document
   using var document = Converter.ConvertMarkdown(sourcePath);

   // Convert HTML document to BMP image file format
   Converter.ConvertHTML(document, new ImageSaveOptions(ImageFormat.Bmp), savePath);

Convert Markdown to GIF in C#

The following code snippet demonstrates how to convert Markdown to GIF:

using System.IO;
using Aspose.Html.Converters;
using Aspose.Html.Saving;
using Aspose.Html.Rendering.Image;
...
   // Prepare a path to a source Markdown file
   string sourcePath = Path.Combine(DataDir, "document.md");

   // Prepare a path for converted file saving 
   string savePath = Path.Combine(OutputDir, "output.gif");

   // Convert Markdown to HTML document
   using var document = Converter.ConvertMarkdown(sourcePath);

   // Convert HTML document to GIF image file format
   Converter.ConvertHTML(document, new ImageSaveOptions(ImageFormat.Gif), savePath);

Convert Markdown to TIFF in C#

The following code snippet demonstrates how to convert Markdown to TIFF:

using System.IO;
using Aspose.Html.Converters;
using Aspose.Html.Saving;
using Aspose.Html.Rendering.Image;
...
   // Prepare a path to a source Markdown file
   string sourcePath = Path.Combine(DataDir, "document.md");

   // Prepare a path for converted file saving 
   string savePath = Path.Combine(OutputDir, "output.tiff");

   // Convert Markdown to HTML document
   using var document = Converter.ConvertMarkdown(sourcePath);

   // Convert HTML document to TIFF image file format
   Converter.ConvertHTML(document, new ImageSaveOptions(ImageFormat.Tiff), savePath);

Text “Banner MD to JPG Converter”