Convert HTML to JPG – C# Examples and Online Converter

JPG files can contain high-quality image data with lossless compression. This unique compression feature allows to quickly and efficiently share JPG images and use them widely on the Web, computers, and mobile devices. Converting HTML files to the JPG image may be required, for example, if you want to add a web page in a PowerPoint presentation or send it by e-mail. Using Converter.ConvertHTML methods is the most common way to convert HTML code into various formats. JPG is a commonly used format for storing images, and HTML to JPG conversion is very popular. With Aspose.HTML, you can convert HTML to JPG format programmatically with full control over a wide range of conversion parameters.

In this article, you find information on converting HTML to JPG by using ConvertHTML() methods of the Converter class and applying ImageSaveOptions and ICreateStreamProvider parameters.

Online HTML Converter

You can check the Aspose.HTML API functionality and convert HTML in real-time. Please load HTML from the local file system, select the output format and run the example. In the example, the save options are set by default. You will immediately receive the result as a separate file.

                
            

If you want to convert HTML to JPG programmatically, please see the following C# code examples.

HTML to JPG by a single line of code

The static methods of the Converter class are primarily used as the easiest way to convert HTML code into various formats. You can convert HTML to JPG in your C# application literally with a single line of code!

1using System.IO;
2using Aspose.Html.Converters;
3using Aspose.Html.Rendering.Image;
4using Aspose.Html.Saving;
5...
6    // Invoke the ConvertHTML() method to convert the HTML code to JPG image
7    Converter.ConvertHTML(@"<h1>Convert HTML to JPG!</h1>", ".", new ImageSaveOptions(ImageFormat.Jpeg), Path.Combine(OutputDir, "convert-with-single-line.jpg"));

Convert HTML to JPG

Converting a file to another format using the ConvertHTML() method is a sequence of operations among which document loading and saving:

  1. Load an HTML file using the HTMLDocument class ( spring.html).
  2. Create a new ImageSaveOptions object with JPG ImageFormat. By default, the Format property is PNG.
  3. Use the ConvertHTML() method of the Converter class to save HTML as a JPG image. You need to pass the HTMLDocument, ImageSaveOptions, and output file path to the ConvertHTML() method to convert HTML to JPG.

Please take a look over the following C# code snippet which shows the process of converting HTML to JPG using Aspose.HTML for .NET.

 1using System.IO;
 2using Aspose.Html;
 3using Aspose.Html.Converters;
 4using Aspose.Html.Rendering.Image;
 5using Aspose.Html.Saving;
 6...
 7    // Prepare a path to a source HTML file
 8    string documentPath = Path.Combine(DataDir, "spring.html");
 9
10    // Prepare a path for converted file saving 
11    string savePath = Path.Combine(OutputDir, "spring-output.jpg");
12
13    // Initialize an HTML document from the file
14    using var document = new HTMLDocument(documentPath);
15
16    // Initialize ImageSaveOptions 
17    var options = new ImageSaveOptions(ImageFormat.Jpeg);
18
19    // Convert HTML to JPG
20    Converter.ConvertHTML(document, options, savePath);

The figure illustrates the spring-output.jpg file.

Text “spring-output.jpg image”

You can download the complete examples and data files from GitHub.

Save Options

The JPG images creation functionality can be enhanced with save options per your needs. Aspose.HTML allows converting HTML to JPG using default or custom save options. ImageSaveOptions usage enables you to customize the rendering process. You can specify the image format, page size, margins, CSS media-type, etc.

PropertyDescription
CompressionSets Tagged Image File Format (TIFF) Compression. By default, this property is LZW.
CSSGets a CssOptions object which is used for configuration of CSS properties processing.
FormatSets the ImageFormat (JPG, PNG, BMP, TIFF, or GIF). By default, this property is PNG.
BackgroundColorThis property sets the color that will fill the background. By default, this property is Transparent.
PageSetupThis property gets a page setup object and uses it for configuration output page-set.
HorizontalResolutionSets horizontal resolution for output images in pixels per inch. The default value is 300 dpi.
VerticalResolutionSets vertical resolution for output images in pixels per inch. The default value is 300 dpi.
SmoothingModeThis property sets the rendering quality for this image. Available values are Invalid, Default, HighSpeed, HighQuality, None, and AntiAlias.
TextGets a TextOptions object which is used for configuration of text rendering.

The following example shows how to use ImageSaveOptions and create the output image with custom save options such as a page size and background color:

 1using System.IO;
 2using Aspose.Html;
 3using Aspose.Html.Converters;
 4using Aspose.Html.Rendering.Image;
 5using Aspose.Html.Saving;
 6using System.Drawing;
 7using Aspose.Html.Drawing;
 8...
 9    string documentPath = Path.Combine(OutputDir, "save-options.html");
10    string savePath = Path.Combine(OutputDir, "save-options-output.jpg");
11
12    // Prepare HTML code and save it to a file
13    var code = "<h1>  Image SaveOptions </h1>\r\n" +
14               "<p>Using ImageSaveOptions Class, you can programmatically apply a wide range of conversion parameters such as BackgroundColor, Format, Compression, PageSetup, etc.</p>\r\n";
15
16    File.WriteAllText(documentPath, code);
17
18    // Initialize an HTML Document from the html file
19    using var document = new HTMLDocument(documentPath);
20
21    // Set up the page-size 400x250 pixels, margins and change the background color to AntiqueWhite
22    var options = new ImageSaveOptions(ImageFormat.Jpeg)
23    {
24        BackgroundColor = System.Drawing.Color.AntiqueWhite
25    };
26    options.PageSetup.AnyPage = new Page(new Aspose.Html.Drawing.Size(400, 250), new Margin(40, 40, 20, 20));
27
28    // Convert HTML to JPG
29    Converter.ConvertHTML(document, options, savePath);

To learn more about the ImageSaveOptions class, please read the Fine-Tuning Converters article.

Convert HTML to JPG using ImageSaveOptions

To convert HTML to JPG with ImageSaveOptions specifying, you should follow a few steps:

  1. Load an HTML file using one of the HTMLDocument() constructors of the HTMLDocument class ( color.html).
  2. Create a new ImageSaveOptions object with JPG ImageFormat and specify save options. By default, the Format property is PNG.
  3. Use the ConvertHTML() method of the Converter class to save HTML as a JPG image. You need to pass the HTMLDocument, ImageSaveOptions, and output file path to the ConvertHTML() method to convert HTML to JPG.

The following C# code snippet shows how to convert HTML to JPG using custom save options:

 1using System.IO;
 2using Aspose.Html;
 3using Aspose.Html.Converters;
 4using Aspose.Html.Rendering.Image;
 5using Aspose.Html.Saving;
 6using System.Drawing;
 7using Aspose.Html.Drawing;
 8using System.Drawing.Drawing2D;
 9...
10    // Prepare a path to a source HTML file
11    string documentPath = Path.Combine(DataDir, "color.html");
12
13    // Prepare a path for converted file saving 
14    string savePath = Path.Combine(OutputDir, "color-output-options.jpg");
15
16    // Initialize an HTML document from the file
17    using var document = new HTMLDocument(documentPath);
18
19    // Initialize ImageSaveOptions 
20    var options = new ImageSaveOptions(ImageFormat.Jpeg)
21    {
22        SmoothingMode = SmoothingMode.HighQuality,
23        HorizontalResolution = 200,
24        VerticalResolution = 200,
25        BackgroundColor = System.Drawing.Color.AliceBlue
26    };
27    options.PageSetup.AnyPage = new Page(new Aspose.Html.Drawing.Size(500, 500), new Margin(30, 20, 10, 10));
28
29    // Convert HTML to JPG
30    Converter.ConvertHTML(document, options, savePath)

The ImageSaveOptions() constructor initializes an instance of the ImageSaveOptions class that is passed to ConvertHTML() method. The ConvertHTML() method takes the document, options, output file path savePath and performs the conversion operation.

In the above example, we use:

The ImageSaveOptions class provides numerous properties that give you full control over a wide range of parameters and improve the process of converting HTML to Image formats. Among these properties, SmoothingMode that enables you to set the rendering quality for the image. Available values are Invalid, Default, HighSpeed, HighQuality, None, and AntiAlias. You can select any value, considering the advantages and disadvantages of each one.

The figure illustrates the color-output-options.jpg file.

Text ““Color” JPG image”

You can download the complete examples and data files from GitHub.

Output Stream Providers

If it is required to save files in the remote storage (e.g., cloud, database, etc.) you can implement the ICreateStreamProvider interface to have manual control over the file creating process. This interface is designed as a callback object to create a stream at the beginning of the document/page (depending on the output format) and release the early created stream after rendering the document/page.

Aspose.HTML for .NET provides various types of output formats for rendering operations. Some of these formats produce a single output file (for instance, PDF, XPS), others create multiple files (Image formats – JPG, PNG, etc.).

The example below shows how to implement and use your own MemoryStreamProvider in the application:

 1using System.IO;
 2using System.Collections.Generic;
 3...
 4    class MemoryStreamProvider : Aspose.Html.IO.ICreateStreamProvider
 5    {
 6        // List of MemoryStream objects created during the document rendering
 7        public List<MemoryStream> Streams { get; } = new List<MemoryStream>();
 8
 9        public Stream GetStream(string name, string extension)
10        {
11            // This method is called when the only one output stream is required, for instance for XPS, PDF or TIFF formats.
12            MemoryStream result = new MemoryStream();
13            Streams.Add(result);
14            return result;
15        }
16
17        public Stream GetStream(string name, string extension, int page)
18        {
19            // This method is called when the creation of multiple output streams are required. For instance, during the rendering HTML to list of image files (JPG, PNG, etc.)
20            MemoryStream result = new MemoryStream();
21            Streams.Add(result);
22            return result;
23        }
24
25        public void ReleaseStream(Stream stream)
26        {
27            //  Here you can release the stream filled with data and, for instance, flush it to the hard-drive
28        }
29
30        public void Dispose()
31        {
32            // Releasing resources
33            foreach (var stream in Streams)
34                stream.Dispose();
35        }
36    }
 1using System.IO;
 2using Aspose.Html;
 3using System.Linq;
 4using Aspose.Html.Converters;
 5using Aspose.Html.Rendering.Image;
 6using Aspose.Html.Saving;
 7...
 8    // Create an instance of MemoryStreamProvider
 9    using var streamProvider = new MemoryStreamProvider();
10
11    // Initialize an HTML document
12    using var document = new HTMLDocument(@"<h1>Convert HTML to JPG File Format!</h1>", ".");
13
14    // Convert HTML to JPG using the MemoryStreamProvider
15    Converter.ConvertHTML(document, new ImageSaveOptions(ImageFormat.Jpeg), streamProvider);
16
17    // Get access to the memory stream that contains the result data
18    var memory = streamProvider.Streams.First();
19    memory.Seek(0, SeekOrigin.Begin);
20
21    // Flush the result data to the output file
22    using (FileStream fs = File.Create(Path.Combine(OutputDir, "stream-provider.jpg")))
23    {
24        memory.CopyTo(fs);
25    }

You can download the complete examples and data files from GitHub.

Download our Aspose.HTML for .NET library allows you to successfully, quickly, and easily convert your HTML, MHTML, EPUB, SVG, and Markdown documents to the most popular formats.

Aspose.HTML offers a free online HTML to JPG Converter that converts HTML to JPG image with high quality, easy and fast. Just upload, convert your files and get results in a few seconds!

Text “Banner HTML to JPG Converter”

Subscribe to Aspose Product Updates

Get monthly newsletters & offers directly delivered to your mailbox.