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.
To request an equation create a URL in the following format:
https://latex.codecogs.com
/ type
. format
? LaTeX
where
type is a graphical format required, any of:
PNG | The most universally supported format for all platforms. |
GIF | The oldest supported format for all platforms. We also embed baseline offset within the header of the GIF image format. |
SVG | A vector-based graphic that is rapidly becoming standard across all browsers and will be the main format Codecogs supports going forward. |
EMF | A vector-based graphic popular within Windows and Adobe Illustrator. |
A vector-based Portable Document Format (can only be used with download). |
format defined how the rendered image is downloaded:
image | An graphical image in the desired type. |
json | A javascript JSON array with th rendered equation details. |
javascript | Similar to json but wrapped in a function called ParseEqn(). |
download | Identical to image except it triggers a browser to download the file instead of displaying it. |
LaTeX is LaTeX markup that is used to define an equation.
At the simplest and most fundamental level, equations are created using a single HTML image tag, e.g:
<img src="https://latex.codecogs.com/png.image?1+sin^2(x)" />
<img src="https://latex.codecogs.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.
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.codecogs.com/png.json?1+sin^2(x) https://latex.codecogs.com/svg.json?1+cos^2(x) https://latex.codecogs.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.codecogs.com/eq/25/49/2549636a77dcfb9f09ea7ea110f10a1a_2ff.png",
"base64":"iVBORw0KGgoAAAANSUhEUgAAAFYAAAAVBAMAAAAutAQGAAAAMFBMVEX/
//8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAv3a
B7AAAAD3RSTlMARM0yInYQiatmmVTd77sbBE1NAAAACXBIWXMAAA7EAAAOxAGVKw4b
AAABgElEQVQoFYWRP0jDQBTGv7SXNmdsG11EuhQXB5fg4qSNglREMG66ZVLEDsFNXQ
ou2YzgoNDBQewaVIQ41aVzRXDu5NzJTerd5cTG9M8bvvfe93685O6AERGejhjGR8TW
3LgzvEuXaAfI2IJQh3PRJMv2alGZuWV52oyaPlWasqk6wI6sQ2C9LFlm/wYxZHXOck
nWKZYLkr2UXl9STQu6L41sMJKdgo28JVmllmDpzVX6Bfre4bVJej0XOYYW72bvgXaC
DXFylDNXl329IxZOAulgxX8Fugn22HSMbQR1qOybLNYAFWWH/fWHZCc8b87zXDbb+g
7AnrYBzRbsItddLq3EXlS6eAfeULA4gCqXBS7t/2wqQFtvGqSLB4UD/GwK+WIXIlhD
eIjuV4NiZ12fltCgwk85qNMWtUA6OLiYN4UZsUoxRPrMUX0sPQtbDVB5mnkEqB/t5D
rg3bhNakx45B2RhOz/lbHqU3YbMXdwsylt9nJjQwkEQqNTjcEtMSfAD6j8THVOt4hN
AAAAAElFTkSuQmCC"
}
}
The JSON tags are:
type | The graphical format of the equation. |
equation | The request equation after it have been cleaned, removing hundreds of common errors often make with LaTeX. |
site | The website making the request. We use this for setting CORS permission so the image can be viewed on other websites. |
file | A unique name we assign to the image you requested. |
url | The 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. |
width | The width of the image. [GIF only] |
height | The height of the image. [GIF only] |
base64 | The 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.codecogs.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
});