Animation of Lists
and Cards

Animated elements draw more attention to the website. Here’s what you can design as lists and cards:
Reviews
Services
Key Benefits
FAQ
Team
Case Studies
Examples of animated cards and lists on a website
Client Reviews
I think if you do something and it turns out pretty good, then you should go do something else wonderful, not dwell on it for too long.
Before incorporating visual aids into speeches, the speaker should understand that if used incorrectly, the visual will not be an aid, but a distraction.
You can't connect the dots looking forward, you can only connect them looking backwards.
Edward Stown
Silvia Mastows
Jeff Missoul
SRT Group
Facebook
Silina Group
1st Column — Fade In Up
Duration — 1 sec
Distance — 100px
2d Column — Fade In Up
Duration — 1 sec
Distance — 100px
Delay — 0.5 sec
3d Column — Fade In Up
Duration — 1 sec
Distance — 100px
Delay — 1 sec
What We Offer
We design
We are the leading firm delivering quality and value to our clients
We illustrate
We are experienced in digital illustration, logo and icon design
Headings, subheadings, dividers — not animated
Images — Fade In Left / Right
Duration —1 sec
Distance — 100px
Our Case Studies
Photos — not animated
Card and text — Fade In Down
Duration — 1.8 sec
Distance — 15px
Design set for Lyrics lookbook
Interiors and identity for Bookshelves space
What you will get from the course?
Read 15 lectures on design and art history from different times and styles. We research and study design trends. Find out how it all started!
Basic design skills
We discover classic works, modern illustrations and analyze artists' and designers' practices of composition. Learn the basics!
Composition principles
Be qualified! We love tech and everything new. Therefore, we use the latest innovative tools for fast and progressive design.
Being confident in graphic software
GET YOUR BENEFITS
Marks — Zoom In
Duration — 2 sec
Scale — 85px
Delay — + 0.8 sec
Text — Fade In Left
Duration — 1 sec
Distance — 100px
Delay — + 0.8 sec
Frequently Asked Questions
Question: I think if you do something and it turns out pretty good, then you should go do something else wonderful, not dwell on it for too long?
Answer: Before incorporating visual aids into speeches, the speaker should understand that if used incorrectly, the visual will not be.
Question: I think if you do something and it turns out pretty good, then you should go do something else wonderful, not dwell on it for too long?
Message — Fade In Right
Duration — 1 sec
Scale —100px
Message 2 — Fade In Left
Duration — 1 sec
Distance — 100px
Delay — 0.5 sec
Message 3 — Fade In Right
Duration —1 sec
Distance — 100px
Delay — 1 sec
You Will Like Us
All our professionals have more than 5 years of legal experiences
We offer 30-minute professional consultations with our specialists
We have fixed prices for all basic products and services
Quality
Support
Price
We work hard every day to make our customers' lives better and happier
Rhombus — Zoom In
Duration —1.5 sec
Scale — 75px
Circle — Zoom In
Duration — 1.5 sec
Scale — 75px
Delay — 0.4 sec
Triangle — Zoom In
Duration —1.5 sec
Scale — 75px
Delay — 0.8 sec
Text — not animated
Our Team
Card 1 — Fade in Up
Duration —1 sec
Distance — 100px
Card 2 — Fade in Up
Duration — 1 sec
Distance — 100px
Delay — 0.3 sec
Card 3 — Fade in Up
Duration —1 sec
Distance — 100px
Delay — 0.6 sec
VIDEO TUTORIAL
How to recreate this animation effect in the Tilda editor