Dotmatrix turns any logo into an animated dot-matrix SVG — for founders, designers and developers who want a brand mark that moves. Upload a PNG, JPG or SVG, pick a motion, export in seconds.
Only animate logos you have the rights to use — license
Free plan · No signup · Pro $5/mo or $29 lifetime
A focused tool that does one thing beautifully — and a package so you can do it in code.
PNG, JPG, WebP or SVG. Sampled to a crisp grid at any resolution you like.
Rings, sweeps, sparkles, waves and transforms — each tuned to read on any logo.
Keep the original sampled colors, go monochrome, or force a single brand color.
Export SMIL that animates as <img> or background anywhere, or compact inline CSS.
Density, threshold, dot shape, gaps and speed — live, with instant preview.
Drop <AnimatedLogo> into React, or call the framework-free core from any JS.
Live dot-matrix renders of real brand marks — each with a hand-picked animation and resolution.
Our eyes are wired for movement — an animated logo turns a static mark into a moment people actually notice.
A logo animation adds a second dimension to your brand storytelling. The same mark can set a completely different tone in a split second: a quick, energetic reveal says you move fast; a soft, looping shimmer reads calm and premium. With Dotmatrix, every brand logo becomes a mesmerizing animated dot-matrix SVG — lightweight, infinitely scalable, and ready to drop anywhere on the web. Even subtle motion speaks volumes about who you are.
And creating an animated logo has never been easier. Upload any logo — PNG, JPG or SVG — and watch it resolve into a living grid of dots in seconds. No timelines, no keyframes, no design degree required. Pick from dozens of hand-tuned motion presets, tweak density, color, speed and direction live, then export a self-contained SVG animation you can use immediately. It's fast, it's fun, and you never start from a daunting blank canvas.
The same mark, animated eight different ways. There are dozens more inside.
Drag in a PNG, JPG or SVG. We rasterize and sample it into a clean grid.
Tune density, colors and dot shape, then pick from dozens of animations.
Download a self-contained SVG or copy code for React and the web.
The same engine that powers this site ships as logo-dot-matrix — a zero-dependency package with a React component and a framework-free core.
import { AnimatedLogo } from "logo-dot-matrix/pro/react";
export function Logo() {
return (
<AnimatedLogo
src="/logo.png"
animation="spiral-in"
dotColor="#6366f1"
density={44}
/>
);
}The same animated mark, dropped into the places it'll actually run. Everything below is rendering live, right now.
Your app's loading screen.
Your site header, alive.
Loading posts…
The moment your dashboard loads.
Even your favicon.
Front and center in your README.
Standing out in the inbox.
A reaction in your team chat.
Social posts & ads that stop the scroll.
Opening your next pitch deck.
Made with Dotmatrix — join the makers animating their logos
Animate as many logos as you like on the house. Go Pro for full resolution, every export format and a commercial license.
Everything you need to get going.
No signup required
For brands shipping to production.
$60/yr $36/yr billed annually
Launch price for early adopters.
Own Pro forever — no renewal
For teams and agencies at volume.
Everything in Pro, plus
14-day refund policy · cancel anytime — see terms
The short version of everything people ask before hitting export.
PNG, JPG, WebP, GIF or SVG. Raster images are sampled straight to the dot grid; SVGs are rasterized first at high resolution so even tiny vector marks come out crisp.
No. Your logo never leaves your machine — it is rasterized and sampled entirely in your browser using the canvas API, and exports are generated locally too. There is no server round-trip for your artwork.
8 curated animations (of 30 total), densities from 8 up to 40 dots, SVG (SMIL) export with a small “Made with Dotmatrix” watermark, 2 saved projects, and personal use. Free forever, no signup needed to try it.
Free exports embed a small, low-opacity “Made with Dotmatrix” credit in the bottom-right corner of the SVG. It is part of the exported file, not an overlay. Pro and Studio exports are completely watermark-free.
Pro and Studio exports can be used in client work, products, ads and anything else commercial. The Free plan is licensed for personal, non-commercial use. Full details are on the license page.
Yes — monthly and yearly plans can be cancelled anytime and keep working until the end of the billing period, and every purchase (including the $29 lifetime deal) has a 14-day refund policy. See the terms for details.
Bold, high-contrast marks read best on a dot grid. Fine detail and thin strokes benefit from a higher density — up to 96 dots on Pro — and you can tune the sampling threshold, dot shape and gaps live until it looks right.
It takes about ten seconds. Upload a logo and pick an animation.
Open the app