CSS

150+ CSS Cards Layouts with Code and Demos

Byfrontend October 18, 2023December 30, 2024

Title:- Shopping Layout Sample Design
Author:-Takane Ichinose
Made with:-HTML CSS JS

Title:- News Cards – CSS only
Author:- Aleksandar Cugurovic
Made with:-HTML CSS JS

Title:- Folding Cards Animation
Author:-Dan Benmore
Made with:-HTML CSS JS

Title:- Card Animation
Author:-Lam Chang
Made with:-HTML CSS JS

Title:- Color Palette Trading Cards
Author:-Mike Mangialardi
Made with:-HTML CSS JS

Title:- Mini Profile
Author:-summer
Made with:-HTML CSS JS

Title:- Animated Weather Cards
Author:- Steve Gardner
Made with:-HTML CSS JS

Title:- Tailwindcss Card Demo
Author:-Russ Pate
Made with:-HTML CSS JS

Title:- Material Cards
Author:-ZhangZhuo
Made with:-HTML CSS JS

Title:- Pokemon Figures
Author:-Clara Beyer
Made with:-HTML CSS JS

Pages: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

CSS

50+ CSS Thumbnails Free Code & Demo (Updated)
Byfrontend December 20, 2020February 25, 2024

Make your portfolio stand out with interactive and engaging thumbnails. Explore the power of CSS to create animated thumbnails, hover effects, and content previews, showcasing your work 1. Thumbnail With Animated Captions by SitePoint See the Pen Thumbnail With Animated Captions bySitePoint(@SitePoint) on CodePen. Author: SitePoint Links: Source Code / DemoMade with: HTML CSS 2….

Read More 50+ CSS Thumbnails Free Code & Demo (Updated)
CSS

60+ Examples of CSS Scroll Down Arrows Animation
Byfrontend October 18, 2023October 18, 2023

In this article, we’re going to look at 60+ examples of CSS Scroll Down Arrows Animation. Scroll down arrows are an easy way to add a little bit of movement to your site. You can use them to draw the eyes of your readers down the page, which helps them focus on what you have…

Read More 60+ Examples of CSS Scroll Down Arrows Animation
CSS

50+ Responsive CSS sidebar navigation menu example
Byfrontend February 16, 2024February 16, 2024

Read More 50+ Responsive CSS sidebar navigation menu example
CSS

50+ CSS Bubble Animations That Pop: CodePen Examples to Inspire Your Designs
Byfrontend February 5, 2024February 4, 2024

Master CSS animation skills by exploring 50+ creative bubble effects. Learn to create smooth, eye-catching animations that elevate your web projects. 1. Submarine & Bubbles by Emily Goldfein See the Pen Submarine & Bubbles byemilygoldfein(@emilygoldfein) on CodePen. Author: Emily Goldfein Links: Source Code / DemoMade with: HTML CSS 2. Notification bubble animation by Emanuel Serbanoiu…

Read More 50+ CSS Bubble Animations That Pop: CodePen Examples to Inspire Your Designs
CSS

Get Inspired: 30 CSS Text Shadow Ideas for Eye-Catching Typography
Byfrontend October 18, 2023October 18, 2023

See the Pen Flickering Neon Sign Effect using CSS Text & Box Shadow by George W. Park (@GeorgePark) on CodePen. Title:- Flickering Neon Sign Effect using CSS Text & Box ShadowAuthor:- George W. ParkMade With:- HTML CSS See the Pen 3D CSS/JS dynamic shadow by Marc López (@Loopez10) on CodePen. Title:- 3D CSS/JS dynamic shadowAuthor:-…

Read More Get Inspired: 30 CSS Text Shadow Ideas for Eye-Catching Typography
CSS

35+ stunning css paper effect examples for your next design project
Byfrontend October 18, 2023October 18, 2023

Take your design projects to the next level with 40+ stunning css paper effect examples! From vintage to modern, discover the versatility and beauty of this technique today Title:-#codepenchallenge Paperboy Author:-Liam Made with:- HTML CSS JS Title:-Editable College Ruled Paper Author:-Preston Farr Made with:- HTML CSS JS Title:-Letter opening Author:-Paul Made with:- HTML CSS JS…

Read More 35+ stunning css paper effect examples for your next design project