Back to Blog
Open Text Tool
Advanced • 6 min read

Mastering Custom Fonts & Arabic/RTL Support in 3D

Most web 3D tools break when you try to type in Arabic, Hebrew, or Urdu. Here is how Vextrude solves it, and how to use your own font files.

Vextrude Team

Updated Dec 29, 2025

Typography is personal. Sometimes the default fonts just won't cut it, or you need to support a language that isn't written left-to-right.

1. Using Custom Fonts (.TTF / .OTF)

Vextrude uses the Three.js FontLoader, which typically requires a special JSON format. However, we have integrated a real-time converter (using Opentype.js) so you don't have to worry about that.

How to upload:

  1. Locate the Font section in the left sidebar.
  2. Click the Upload File button.
  3. Select any .ttf or .otf file from your computer.
  4. The tool will instantly parse the font shapes and regenerate the 3D mesh.

Note: Your font is processed locally in your browser. It is never uploaded to our servers, ensuring your font licenses remain secure.

2. The RTL Challenge

If you have ever tried to paste Arabic text into Photoshop or a standard 3D app, you know the pain: the letters disconnect, and the text reads backwards (Left-to-Right instead of Right-to-Left).

This happens because most graphics libraries (like WebGL) don't natively understand "text reshaping" or bi-directional (Bidi) algorithms.

3. How Vextrude Handles Arabic & Urdu

We have built a custom implementation of Arabic-Persian-Reshaper directly into the Text Tool.

  • Auto-Detection: As soon as you type characters from the Arabic or Hebrew unicode blocks, the tool detects it.
  • Reshaping: It converts the "isolated" forms of letters into their "medial" or "initial" forms so they connect correctly.
  • Reordering: It visually reverses the string so it renders Right-to-Left in the 3D space.

If for some reason the detection fails, you can manually toggle the "Force RTL" switch in the Advanced settings.

4. Mesh Optimization for Performance

3D text can generate a lot of triangles, especially with curvy fonts or serif typefaces.

If you are exporting for a game or a mobile web experience, look for the "Curve Segments" slider.

  • High (12+): Very smooth curves. Best for high-res rendering or 3D printing.
  • Low (1-4): More angular curves, but significantly lower file size (polycount). Best for real-time games.

Try these features now

Upload your own font or type in Arabic to see the magic.

Go to Text Tool