# How do I animate Hindi, Tamil and other Indian language text in UI without breaking it?

> Never split Indian-script text into single characters for letter-by-letter animation: Devanagari, Tamil, Bengali and other scripts combine several Unicode characters into one visible cluster, and splitting them breaks the shapes. Split by grapheme cluster with Intl.Segmenter, or animate whole words or lines. Also allow more line height, test with real fonts, and check that your animation tool shapes complex scripts correctly.

Updated November 2026. Source: https://www.exodeui.com/questions/how-to-animate-indian-language-text-in-ui/

## Key takeaways

- Indian scripts use conjuncts and vowel signs that join characters
- Splitting a string with split('') breaks those shapes
- Use Intl.Segmenter with granularity "grapheme" or animate by word
- Allow extra line height for marks above and below the line
- Test in every animation tool and runtime you ship

## Frequently asked questions

### Why does my Hindi text show dotted circles when animated?

The text was split between a base letter and its vowel sign or virama. Split by grapheme cluster or by word.

### Can Lottie show Hindi text?

Yes if the text is converted to shapes or the font is available to the player. Converted text cannot be translated at runtime.

### Does Intl.Segmenter work in all browsers?

It is supported in current versions of the major browsers. Check your minimum supported versions.

### Which fonts are safe for Devanagari UI?

Noto Sans Devanagari and Mukta are widely used and free. Test weights and rendering on Android.

## Related

- [Best text effect animation tools](https://www.exodeui.com/best-text-effect-animation-tools)
- [Text animation](https://www.exodeui.com/text-animation)
- [Stagger animation guide](https://www.exodeui.com/learn/stagger-animation)
- [Festive UI animations for Indian apps](https://www.exodeui.com/questions/festive-ui-animations-for-indian-apps)