How do I add a typewriter effect to my website?

Add the OneType Transforms script tag to your site, then wrap text strings in span elements inside an element with the ot="typewriter" attribute. Each child span becomes one string in the typing rotation. No JavaScript needed.

Is the typewriter text effect free?

Yes. The typewriter transform from OneType Transforms is completely free. No account needed, no token required, no usage limits. Just add the script tag and start using it on unlimited domains.

Can you make a typewriter effect with just CSS?

A CSS-only typewriter effect works for a single fixed string using keyframe animations. But you cannot cycle through multiple strings, delete, or retype with CSS alone. For dynamic multi-string typing, you need JavaScript or an attribute-based solution like OneType.

Does the typewriter effect work on Webflow and WordPress?

Yes. It works on Webflow, WordPress, Squarespace, Shopify, Framer, and any platform that allows custom HTML. Add the script tag once, then place the typewriter HTML wherever you want it.

Can you customize the typing speed and cursor?

Yes. Use HTML attributes to control typing speed, delete speed, pause duration, cursor character, looping, shuffle, and smart backspace. All options are set through attributes like ot-speed, ot-cursor, and ot-loop.

Typewriter Effect - How to Add One to Any Website