Introducing DOMRander — A DOM to Canvas renderer focused on RTL and Persian/Arabic text

DOMRander — A DOM to Canvas renderer focused on RTL and Persian/Arabic text

Hi,

I recently built DOMRander, a dependency-free DOM to Canvas renderer inspired by the general idea of rendering HTML/CSS content onto a Canvas.

The main reason I started this project was to experiment with better handling of Persian, Arabic, RTL, mixed RTL/LTR, and Unicode text rendering in browser-based DOM-to-Canvas rendering.

What DOMRander currently supports

• HTML to Canvas rendering
• Persian and Arabic RTL text
• Mixed RTL / LTR content
• Unicode characters
• Custom fonts
• Backgrounds and linear gradients
• Borders and border-radius
• Box shadows
• Opacity
• CSS transforms
• Basic overflow clipping
• Canvas, DataURL, and Blob output
• Zero dependencies

Project

GitHub: https://github.com/fouad-salehi/DOMRander

Example

The project includes a playground where the same DOM can be viewed in the browser and rendered through DOMRander to Canvas.

I’m sharing it here because it may be useful to people working with RTL languages or looking for another approach to DOM-to-Canvas rendering.

This is an independent project and is not intended to replace html2canvas.

Thanks to the html2canvas project and its contributors for the inspiration and the work that made this space possible.