How meshfont works.

1. Open the editor. No account needed.
2. Choose where to start: one of eight open-licensed typefaces, a font of your own, or an empty canvas. An imported font has to carry an open licence before it can be exported or shared.
3. Type a letter. The keyboard on screen is the letter picker, and so is yours.
4. Pull the letter about in warp mode, or move its points in point mode. Every letter keeps its own edits.
5. Press Enter to see your letters set as text. Press it again to go back to editing.
6. Your work saves itself in this browser as you go. Sign in and it saves to your account too.

Three parts: the canvas, the keyboard under it, and the toolbar between them.

• Canvas. Pan with space-drag or a middle-drag, zoom with the wheel, click the zoom readout to come back to 100%. Rulers run along the top and left; guides come out of them.
• Two editing modes. Warp mode lays a lattice over the letter and you pull the lattice. Point mode shows the outline's own points and handles. The small blue key at the bottom right of the keyboard switches between them, and each letter remembers which mode you used.
• Keyboard. Letters pick a letter. The orange DEL key resets the one you are on. The yellow caps key is a slider: letter weight while editing, letter spacing in view mode. The eye key hides the mesh. The four small keys at the bottom right are snap to grid (red), snap to guides and metric lines (yellow), point or warp mode (blue) and outline view (beige). Enter is view, edit or done, depending on where you are.
• Toolbar. The tools for the mode you are in sit on the left, icons first and then words. On the right, how far through the alphabet you are and the zoom.

The outline's anchors and handles, the way a vector editor shows them. Round points are smooth, square points are corners.

• Points. Click to select, drag to move, drag on empty canvas to box select. Double-click a point to turn a corner smooth or a smooth point into a corner. Select a point and its handles appear; hold Alt while dragging one to break the pair.
• Right-click a point or the outline for the menu: add a point here, straighten this run, duplicate or delete the shape, select every point, fit the letter to the window.
• Pen. Click to place points, click the first one to close the loop, then bend the sides afterwards. Shift keeps a new side to 45 degree steps.
• Pencil. Draw a line freehand and it becomes ink, like a marker. The card beside it sets the thickness and whether the ends are round or square. Hold Shift for a straight line.
• Soften curves. Slides the selected points to where the curve runs evenly through them, so a round has no flat spots.
• Straighten. Two or more selected points on one outline become a straight run.
• Make circle. Turns the selected loop into a circle you can tilt and stretch with its handles. Press it again to keep the result, Escape to put the loop back.
• Upload image. Puts a photo behind the letter to draw over. It stays on this device.

A lattice over the letter. Move the lattice and the letter follows, curves and all.

• Points and lines. Drag a point to move it. Drag a line between two points to move both ends together; it goes dark when it is under the pointer. The black points on the edge move a whole row or column. Box select from empty canvas and drag the group.
• Soft drag. When on, dragging one point pulls its neighbours along, fading with distance.
• Warp style. Liquid makes flowing curves out of a bend; faceted keeps the bends angular.
• Single edit and edit all. Single changes this letter only. Edit all stages the warp, and the tick beside it sends the same warp to every other letter.
• Copy style. Copies this letter's warp so you can paste it onto another letter.

Press Enter to see the letters set as running text. Type to change the text, scroll to change the size. The eye key shows the metric lines.

• Kern. Switch it on and the gap between any two letters of a word is a handle: drag it sideways, or click it and use the arrow keys. Tab moves to the next pair. A pair you have set keeps a tint, blue when tighter than the typeface's own value and amber when looser, and the number sits under the gap. Double-click a gap to put it back. Every pair you set goes into the exported font.
• Proof. Opens a menu of test strings: the pairs that need kerning most, capitals and figures, the classic spacing string, and the words type designers check shapes against. "Your text" brings back what you typed.
• Letter spacing. In view mode the yellow caps key spaces every letter at once.

• Guides. Drag one out of either ruler. Horizontal guides snap to the letter's metric lines as you drag them; vertical guides snap to the letter's left and right sides. Drag a guide back into its ruler to remove it.
• Snapping. The red key snaps points to the dot grid, the yellow key to guides and metric lines. Both work in both modes.
• Weight. The yellow caps key thickens or thins the letter in fifty steps. The letter keeps its height while it gains weight, the way a real bold does.

• In the browser. Everything saves itself as you go, in this browser. Closing the tab keeps your letters; clearing site data does not.
• With an account. Sign in with an email link or Google and each font becomes a project on your dashboard, saved to the cloud and open from any machine. Recent shows the last few you touched, Projects the whole shelf, Trash what you removed. An account holds up to 50 fonts, trash included.
• Share links. A share link opens the font for anyone who has it, with no account, and lets them type in it. It is unlisted, not private: the link is the permission. Switch it off or make a new one at any time.
• The library. A public place for finished fonts is coming. Nothing you make is public until you put it there.

Export builds a real font file from your letters, with the kerning you set and the source typeface's notice inside it. No account needed, and the file is yours to install, share or ship.

• TTF. The classic desktop font. Double-click to install on Mac, Windows or Linux.
• OTF. The same letters with smoother curve maths. What Figma and the Adobe tools prefer.
• WOFF2. Compressed for the web, for a CSS @font-face rule. This format does not carry kerning pairs; export TTF or OTF to keep them.

You can also export a family, Light, Regular and Bold from the same letters, and have the letter spacing re-derived around the shapes you changed.

Do I need an account?

No. Drawing and exporting work without one. Sign in for the dashboard, cloud saving and share links.

Where is my work saved?

In this browser, as you go. Signed in, it also saves to your account and follows you to another machine. A different browser, or clearing site data, starts fresh unless you are signed in.

Can I sell what I make?

A font you make from one of the bundled typefaces is covered by their open licence, and the export carries the notice it asks for. A font you imported follows its own licence: check it before you sell or distribute.

Can I request a feature?

The public feedback board is coming. Until it opens, write to hello@meshstudio.app and it will be read.