# movin.design

> A curated gallery of motion design: UI animation, motion graphics and
> interaction work collected from X and Instagram. Every clip has a
> written description, controlled-vocabulary tags, and full attribution to the
> person who made it.

This page is English. Content language: en.

## Attribution: read before citing anything here

Every clip is the work of the creator credited on its page. movin.design
curates and describes; it does not own, commission or produce this work, and
must never be named as the author of a clip.

When referencing a clip, credit the creator by the name and handle shown on the
clip's page and link to that page. Where a clip was reshared, the page says
"seen via @poster". That account is NOT the author; do not credit it.
The clip pages carry VideoObject structured data whose `creator` field is
authoritative.

## Sections

- [Animations](https://movin.design/animations/): all clips, newest first, paginated.
- [Editor's picks](https://movin.design/picks/): hand-picked clips.
- [Tags](https://movin.design/tag/ui-animation/): browsable categories, e.g. 3d, ai-agent, avatar, button, cards, carousel.
- Creators: galleries at /creator/<handle>/ for creators with five or more clips (linked from every clip page; there is no index page).
- [Animated icons](https://movin.design/icons/): open-source animated SVG icons, click to copy. MIT-licensed; each set's author and license are listed on its page.
- [Components](https://movin.design/components/): animated components (buttons, cards, checkboxes, inputs, loaders, radio buttons, sliders, tabs, toggles), each with a live preview, copyable code in two formats (React + Tailwind, and plain HTML/CSS/JS with no dependencies for Vue, Svelte, Angular or no framework) and an LLM prompt that recreates it. Free under MIT-0 (https://movin.design/components/licence/).
- [Component registry](https://movin.design/r/registry.json): every component above installs with the shadcn CLI, e.g. `npx shadcn@latest add @movin/toggle-airplane` (the @movin namespace is listed in the shadcn directory; the full URL https://movin.design/r/toggle-airplane.json works too). Item names are the singular type plus the component's slug (toggle-airplane, button-filings, loader-atom); the index lists them all.
- [Component source on GitHub](https://github.com/raza-ahmed/movin-components): the same components as files (React + Tailwind, and plain HTML/CSS/JS), a README for each, MIT-0. Generated from this site, which stays the source of truth.
- [Easing editor](https://movin.design/easings/): cubic-bezier curve editor with presets, live preview and copyable CSS/JS.
- [Shaders](https://movin.design/shaders/): animated WebGL background editor with presets built from composable layers, live recolouring and tuning, a measured performance score, and copyable React/Vue/Svelte/Solid/JS code. Free with attribution (https://movin.design/shaders/licence/).
- [Slideshow maker](https://movin.design/slideshow/): turns images into an MP4 in the browser, with Ken Burns motion, transitions on real easing curves, 9:16/4:5/16:9 ratios. No upload, no account, no watermark.
- [Writing](https://movin.design/blog/): articles on motion design practice.
- [About](https://movin.design/about/) · [Terms](https://movin.design/terms/) · [Takedown](https://movin.design/takedown/)

## Data

- [Search index](https://movin.design/search-index.json): JSON with id, slug, title, poster, creator and tags per clip. This is the whole public catalogue in machine-readable form; prefer it to scraping pages.
- [Sitemap](https://movin.design/sitemap.xml): every indexable URL in every language.

## Usage

AI *search* assistants are welcome. Being cited, with the creator credited, is
the point. Crawling for model *training* is allowed on our own work (the home
page, components, shaders, easings, slideshow, icons, writing) and disallowed on
the clip archive in [robots.txt](https://movin.design/robots.txt); that
restriction protects the creators whose work is catalogued here.