Motion Mistry · HTML/CSS Animations

Free HTML & CSS News Animations

Copy-paste breaking news tickers, lower thirds, LIVE badges and map pings. Every animation is pure HTML and CSS, built for a 1920×1080 frame, with no JavaScript or library needed.

How to use these in your videos

OBS / Streamlabs: download the .html file and add it as a Browser Source at 1920×1080. The background stays transparent.
Video editors: switch the preview to Green screen, open the .html file full-screen, screen-record it and key out the green in Premiere, CapCut or After Effects.
Websites: paste the code into any page and change the text.

Breaking News Ticker

Endless scrolling headline strip with a red BREAKING label.

View code

Name Lower Third

Slide-in name and title for interviews and analysts.

View code

Urdu Breaking News Strip

Right-to-left Nastaliq strip that slides up from the bottom.

View code

LIVE Badge

Blinking red LIVE badge for the corner of your video.

View code

Headline Text Reveal

Bold two-line headline that rises in from a mask.

View code

Map Location Ping

Radar-style pulsing pin to mark a city on a map.

View code

← All free tools