:: Table of Contents

LaTeX Equation Rendering

The CodeCogs LaTeX Engine is designed to rapidly deliver beautiful equations for consumption across website and mobile devices everywhere. To get started try using the Equation Editor to produce HTML-friendly code that can be copied into any website as an image.

Overview

To request an equation create a URL in the following format:

https://latex.oncodecogs.com / type . format ? LaTeX

where type is a graphical format:

PNGThe most universally supported format for all platforms.
GIFThe oldest supported format for all platforms. We also embed baseline offset within the header of the GIF image format.
SVGA vector-based graphic that is rapidly becoming standard across all browsers and will be the main format Codecogs supports going forward.
EMFA vector-based graphic popular within Windows and Adobe Illustrator.
PDFA vector-based Portable Document Format (can only be used with download).

and format defined how the rendered image is downloaded:

imageAn graphical image in the desired type.
jsonA javascript JSON array with th rendered equation details.
javascriptSimilar to json but wrapped in a function called ParseEqn().
downloadIdentical to image except it triggers a browser to download the file instead of displaying it.

and LaTeX is LaTeX markup that is used to define an equation.

Image

At the simplest and most fundamental level, equations are created using a single HTML image tag, e.g:

<img src="https://latex.oncodecogs.com/png.image?1+sin^2(x)" />
<img src="https://latex.oncodecogs.com/svg.image?1+cos^2(x)" />

Output:

Image like this are used extensively across the internet and mobile platforms, all without having to install anything.

JSON

To retrieve the image in a JSON format with base64 encoding, use the one of the above image formats with .json encoding, e.g

	https://latex.oncodecogs.com/png.json?1+sin^2(x)
	https://latex.oncodecogs.com/svg.json?1+cos^2(x)
	https://latex.oncodecogs.com/gif.json?1+cos^2(x)

Example Output:

{ 
"latex": { 
	"type":"png", 
	"equation":"1+sin^2(x)", 
	"site":"localhost:8000", 
	"file":"2549636a77dcfb9f09ea7ea110f10a1a_2ff.png", 
	"url":"https://latex.oncodecogs.com/eq/25/49/2549636a77dcfb9f09ea7ea110f10a1a_2ff.png", 
	"base64":"iVBORw0KGgoAAAANSUhEUgAAAFYAAAAVBAMAAAAutAQGAAAAMFBMVEX///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAv3aB7AAAAD3RSTlMARM0yInYQiatmmVTd77sbBE1NAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABgElEQVQoFYWRP0jDQBTGv7SXNmdsG11EuhQXB5fg4qSNglREMG66ZVLEDsFNXQou2YzgoNDBQewaVIQ41aVzRXDu5NzJTerd5cTG9M8bvvfe93685O6AERGejhjGR8TW3LgzvEuXaAfI2IJQh3PRJMv2alGZuWV52oyaPlWasqk6wI6sQ2C9LFlm/wYxZHXOcknWKZYLkr2UXl9STQu6L41sMJKdgo28JVmllmDpzVX6Bfre4bVJej0XOYYW72bvgXaCDXFylDNXl329IxZOAulgxX8Fugn22HSMbQR1qOybLNYAFWWH/fWHZCc8b87zXDbb+g7AnrYBzRbsItddLq3EXlS6eAfeULA4gCqXBS7t/2wqQFtvGqSLB4UD/GwK+WIXIlhDeIjuV4NiZ12fltCgwk85qNMWtUA6OLiYN4UZsUoxRPrMUX0sPQtbDVB5mnkEqB/t5Drg3bhNakx45B2RhOz/lbHqU3YbMXdwsylt9nJjQwkEQqNTjcEtMSfAD6j8THVOt4hNAAAAAElFTkSuQmCC"
	} 
}

The JSON tags are:

typeThe graphical format of the equation.
equationThe request equation after it have been cleaned, removing hundreds of common errors often make with LaTeX.
siteThe website making the request. We use this for setting CORS permission so the image can be viewed on other websites.
fileA unique name we assign to the image you requested.
urlThe unique url of the cached image on our servers. Please note the cache is routinely cleaned so equations not used repeatible within 48 hours are removed.
widthThe width of the image. [GIF only]
heightThe height of the image. [GIF only]
base64The base64 encoding of the image.

The following example show how you might use jQuery to fetch an SVG image in base64 format and create an image icon:

$.getJSON('https://latex.oncodecogs.com/svg.json?1+cos^2(x)', function(icon) {
	var imgElem   = document.createElement('img');
	imgElem.src   = `data:image/svg+xml;base64,${icon.base64}`;
	imgElem.alt   = icon.equation;
	imgElem.title = icon.equation;

	$("body").append(imgElem);    // Appends the new image to the page
});
Copied to clipboard