Guides · · Maxwell Prehoda
13 Best Motion Design Websites for Inspiration in 2026, for Film and the Web
For award-winning web motion, start with Awwwards' animation category. For the code behind effects, Codrops. For motion graphics and the industry around it, Motionographer and Stash. For title sequences, Art of the Title. And for how real apps animate real flows, Mobbin. Which one helps depends on what you are making: a brand film, a scroll-driven landing page and a settings screen need very different references.
The lists that rank for this are mostly from 2021 to 2023 and lean entirely on film and broadcast motion. This one covers both worlds, motion graphics and web and UI motion, and we visited every site in November 2026 to check it is still active and what it actually offers.
1. Awwwards: Animation: Best for award-winning interactive and scroll-driven websites
Platform: Website, free to browse; paid Pro and course options
Awwwards' animation category is the fastest way to see what the most ambitious web studios are shipping this week. Entries carry Site of the Day and Developer Award labels, and you can filter by technology (GSAP, Three.js, WebGL, Framer, Webflow and more), category, font and color. In the first days of November 2026 the Sites of the Day included Grids by Obys, a browser game by Marcelo Reis Melo and MECHA by widelab.co.
Use the technology filter as a learning tool: filter by GSAP or Three.js and you are looking at a reading list for the techniques behind each site.
Watch out for: Award sites optimize for wow, not for product UI. Heavy WebGL intros and scroll-jacking that win awards can hurt load time and accessibility on a real product, so borrow the idea, not the weight. The site also promotes paid memberships and courses.
2. Codrops: Best for web animation effects with code you can study
Platform: Website, free; demos released under MIT
Codrops has published front-end tutorials and experimental demos for years, and its demos hub lists more than 500 of them under the MIT license. 2026 tutorials include an interactive 3D wave grid in Three.js by Franky Hung, a Blender camera path turned into a scroll-driven gallery with Three.js and GSAP, and a set of scroll-driven SVG graph and map animations by Tom Miller. Its Inspirational Websites roundups collect standout sites as well.
It is the best bridge between seeing an effect and understanding how it is built.
Watch out for: Demos are experiments. Check performance on a phone, add reduced-motion handling and test keyboard access before you lift one into production.
3. recent.design: Best for a feed of current web, motion and launch video work
Platform: Website, free
Visit godly.website, long a favorite gallery for web design inspiration, and you now land on recent.design, which calls itself the best design inspiration on the internet. It is a feed of current work with browse sections for design, websites, OG images, app screenshots and app icons, a Motion filter, and a newer Launch Videos section for product launch films.
The Launch Videos section is the useful part for motion designers: a running collection of how product companies announce things in motion.
Watch out for: Its homepage does not say who runs it, and many thumbnails are static images, so click through to see the motion itself.
4. Mobbin: Best for how shipped apps animate real user flows
Platform: Website; free account with limited access, paid Pro and Team
Mobbin is a searchable library of real mobile apps, web apps and websites, organized by screens, UI patterns and complete flows such as onboarding, checkout, account setup and subscription. Its paid plans add animations alongside the full library, and Pro includes an MCP connection so AI agents can search it.
When the question is "how do good apps animate this exact step", a library of shipped products beats a gallery of concept shots.
Watch out for: Free access is limited, and animations are listed among paid features. It shows what shipped, not why, so pair it with a source that explains the craft.
5. Motionographer: Best for motion graphics work, studio news and interviews
Platform: Website, free
Motionographer has covered the motion design community since 2006 and marked its 20th year in 2026 with a Motion Plus Design event in New York. It publishes long interviews and studio stories (recent ones cover teamLab at OFFF Barcelona 2026 and Tonic DNA's 40th-anniversary identity), short Quickies showcasing single projects, news, a jobs board and The Motion Awards.
Read it to understand the people and studios behind the work, which is what turns inspiration into taste.
Watch out for: It is about motion graphics, film and brand work. It rarely covers UI or web interaction motion.
6. Stash: Best for deep research in professional animation, VFX and motion
Platform: Paid subscription with a free trial
Stash calls itself the planet's largest online library of animation, VFX and motion design, with a Permanent Collection archive behind it. It features finished films and campaigns from studios such as SAGA and Fortiche, editorial series on things like creative pitching, a news feed on signings and studio launches, and job listings. With Motionographer it runs the State of Motion survey, whose 2026 edition was under way when we checked.
If you pitch or direct for a living, the archive is worth the subscription.
Watch out for: Most of the value is behind the paywall, and the focus is broadcast and commercial work, not product UI.
7. Art of the Title: Best for title sequences and the designers who make them
Platform: Website, free; reader-supported via Patreon
Art of the Title is the reference library for film and TV title design: sequence write-ups, interviews with title designers and studios, and Top Five lists where directors pick their favorite openings. Recent features include Joscha Bongard's sequence for Babystar and the opening of Bonjour Tristesse.
Title sequences are the purest kinetic typography there is, and studying how they pace type is directly useful for any product launch or hero animation. Our kinetic typography examples build on the same ideas.
Watch out for: It updates slowly: the most recent feature we found was from September 2025. Treat it as an archive to dig through, not a feed.
8. School of Motion's web animation list: Best for a short, annotated list of sites with great animation
Platform: Article, free; School of Motion sells courses
School of Motion's 10 Websites with Great Animation in 2026 picks ten sites and says what to steal from each: Epic's typography that morphs on scroll, the restraint of Eszter Bial's portfolio, Apple's scroll-based product pages, Unseen Studio's full-screen navigation, Lusion's mouse-reactive WebGL scene, Uncommon Studio's staggered grid and Active Theory's trailer-like case studies. Each entry ends with a takeaway, which makes it more useful than a gallery.
Use it as a curated starting point, then follow each studio's own site for more.
Watch out for: It closes by promoting School of Motion's Rive courses and membership. The picks lean toward agency sites, not product interfaces.
9. Dropbox Brand: Motion: Best for seeing a real motion system written down
Platform: Website, free
Most inspiration sites show finished pieces. Dropbox's brand guidelines show the rules behind them. The Motion section sets out four principles (Prioritize Simplicity, Deepen Understanding, Instant Feedback and Subtle Playfulness), says motion should scale in expressiveness by context, and specifies an actual easing curve: cubic-bezier(0.65, 0, 0.45, 1). School of Motion's list also singles out the site for using animation to teach the brand.
If your team is writing its own motion guidelines, this is a model of how short and specific they can be.
Watch out for: It is one company's system, tuned to its brand. Copy the structure, not the curve, and test your own durations; our easing examples help.
10. Rive Marketplace: Best for interactive animation files you can open and pick apart
Platform: Website, free to browse; files open in the Rive Editor
Rive's marketplace collects community files in Featured and Latest sections, with a For Hire section for finding Rive animators. Because Rive files carry their state machines, opening one shows not just what an interactive animation looks like but exactly how its states and inputs are wired.
It is the best place to learn interactive motion by reverse-engineering it. Our Rive vs Lottie guide explains when that format is worth it.
Watch out for: Quality varies, as on any community board. And if you build on what you learn, shipping a file from Rive's free plan adds a Rive splash screen.
11. LottieFiles: Best for browsing ready-made animations for apps and sites
Platform: Website; free animations plus a premium library
LottieFiles hosts what it says are more than 800,000 free and premium Lottie animations, with a large free section to browse by search. It is the quickest way to see how hundreds of designers have animated the same idea, whether a success check, an empty state or an onboarding illustration, and to compare styles side by side.
Even if you will not use Lottie, scanning thirty versions of one icon animation is a fast lesson in what reads clearly at small sizes.
Watch out for: The free listing page does not state license terms, so check each animation's page before using it commercially. Using a file means loading a Lottie player; our Lottie alternatives cover lighter options.
12. Our inspiration board: Best for motion pieces you can remake with Claude
Platform: Motions, free to browse Ours
Our inspiration board is an endless board of motion pieces, made for you and Claude. Every tile comes from our Motion Prompts directory, so the thing you are admiring links straight to the prompt that made it, credited to its creator, and style pages group pieces that share a look.
That is the difference from a gallery: you can go from "I like this" to your own version in one step. The Generative Flow Field below is one of the pieces on it.
Watch out for: It shows motion made from prompts and code, so it is strongest on type, shapes, UI and illustration, not live-action film.
13. Our Motion Prompts directory: Best for the prompts behind motion people made with Claude
Platform: Motions directory, free Ours
The Motion Prompts directory has 601 entries: prompts and skills people used to make motion design with Claude, credited to their creators, plus our own CC0 style prompts that each come with a rendered video. Robot Through Twelve Worlds by Pradeep Kapoor, below, sends a robot tumbling through twelve art styles.
For more curated picks, our posts on motion design inspiration, animation inspiration and motion design ideas go deeper.
Watch out for: Community prompts are shared as their creators described them, so results vary with the model and settings you use. Expect to iterate.
How to choose where to look
Match it to what you are making
Brand films and broadcast: Motionographer, Stash, Art of the Title. Landing pages and portfolio sites: Awwwards, the School of Motion list, Codrops. Product UI: Mobbin and the Dropbox motion guidelines. Interactive app animation: Rive Marketplace and LottieFiles. Something to remake today: our inspiration board.
Match it to how deep you need to go
Galleries (Awwwards, recent.design) are for collecting ideas fast. Sources with code or files (Codrops, Rive Marketplace, our Motion Prompts) are for understanding how it was built. Editorial sites (Motionographer, Stash, Art of the Title) are for understanding why it works. A good research session uses one of each.
Turn references into a brief
Save three references, then write one sentence per reference about what exactly you are borrowing: the timing, the easing, the way type enters, the color. That sentence is your brief, and it is also exactly what you paste into a tool. Our motion design trends for 2026 and motion graphics examples give you more to react to.
Turn one reference into your own piece tonight
Pick the reference you keep coming back to. Write down its duration, how elements enter and leave, and its easing, as if you were describing it to an animator. Then hand that description to a tool and see how close you get on the first try.
The Studio takes a description and gives you an editable scene you can export as HTML, React, MP4 or GIF.
Make a 10-second motion piece inspired by Swiss poster design: a visible 12-column grid fades in, three lines of bold grotesque type rise out of baseline masks 150ms apart on an ease-out curve, and a single red bar slides in to anchor the layout. Use black type on off-white with one red accent. Hold the final composition for 3 seconds so it loops cleanly. Also make a reduced-motion version that cross-fades from the empty grid to the finished poster.
Common questions
What is the best website for motion design inspiration?
For web and interactive motion, Awwwards' animation category and Codrops. For motion graphics, Motionographer and Stash. For title sequences, Art of the Title. For product UI motion, Mobbin.
Where can I find web animation inspiration with code?
Codrops publishes tutorials and an MIT-licensed demos hub, Rive Marketplace files can be opened in the editor, and our snippet directories have about 1,800 copy-paste HTML and CSS animations.
What happened to Godly?
When we checked in November 2026, godly.website redirected to recent.design, a design inspiration feed with Motion and Launch Videos sections.
Is Dribbble good for motion design inspiration?
It has plenty of animated shots, but many are concepts that never shipped. For motion that works in real products, pair it with Mobbin for apps and Awwwards for websites.
How do I use inspiration without copying?
Borrow one quality per reference, such as the timing, the easing or how type enters, and combine several. Credit the source when you share work that is clearly derived from it.