Try out the new beta version of! And please leave feedback after checking it out.


This site lets you create a ternary plot freely and easily! Don’t know what ternary plot is? No problem, just check the explanation page.
Some example data is loaded into the tables to show you how it works. Try clicking all the ' + Plot' buttons below for a quick demo. Check the 'How To Use' section below for all the details on how to plot points, lines, and areas. If you have found this tool to be useful, then please donate to support development! Happy ternary plotting!





Help me learn more about you and your use cases so I can improve!

What feature do you miss most?:
Which of the following best describes you?
How often do you use
What other chart types would you like to have a web app like for?

How To Use

Input Parameters

The top row has to contain your column names. Your variable names have to be the first three values of this first row. These first three will be entered as axis labels in the ternary plot.
The axis labels are placed in counter-clockwise order: First column: top, second column: left, third column: right. Note that you have to keep the order of the your three column names consistent between points, lines and areas. You will get a warning when the column names are not consistent between different tables.

Other parameters, like color, opacity or shape also have to be named to in the top row, but do not need to be in any specific order. If you are confused, try reloading the page and taking a good look at the example data!

Enter the values directly and the proportion of each value will calculated. Note that a dot . is used as a decimal separator. Also do not enter the percentage symbol (%)!

You have to enter three values for a point, line or area to be plotted.

Different lines and areas are seperated by one empty row. Only the first row of a line's or area's style parameters are read. The optional parameters on following rows won't be read.

Save data for next time

Values entered in the tables are saved automatically in your browsers storage. So when you come back to this page later, you'll be asked whether you want to load these values.
This web app runs completely on the client-side using JavaScript, so your data never leaves your computer. Put another way, your entered values are not transmitted to any server and are only stored locally on your machine.

Optional Keywords

Keyword Values
Title Text (without commas and dashes). This will appended as an SVG title and will appear when hovering the cursor over the point or line.
Color (or colour) A hexadecimal color value like #dcedff, or a named color like blue or orangered.
Opacity Value between 1 and 0
Point only: Shape Circle, cross, diamond, triangle-down, or triangle-up. Double click on a cell to show a dropdown menu.
Point only: Size Integer. Default is 70.
Line only: Linestyle Dotted, dot-dash, dot-dot-dash, short-dashed, medium-dashed, long-dashed. Double click on a cell to show a dropdown menu.
Line only: Strokewidth The width of the line in pixels. Be warned; anything above 7 px will look too chunky. Default is 4 px.

Donate! is completely free to use and without advertising!. I rely on donations to keep it like that. Maintaining and developing has cost and still takes time and effort. Donations also reinforce my motivation to improve this page. So if it has saved you time and effort, why not support me by a donation or buying me a coffee to keep me caffeinated?