CSS

150+ CSS Cards Layouts with Code and Demos

Byfrontend October 18, 2023December 30, 2024

Title:- Dribble Mockup – Travel Homepage
Author:- miranda
Made with:-HTML CSS JS

Title:- Expanding flex cards
Author:- Zed Dash
Made with:-HTML CSS JS

Title:- Card Text
Author:-Bruce Brotherton
Made with:-HTML CSS JS

Title:- Comment Card with a Dots Background
Author:-Lucas Fernando
Made with:-HTML CSS JS

Title:- Reveal Card Content On Hover
Author:-Mark
Made with:-HTML CSS JS

Title:- Product Page
Author:-Chase Marlow
Made with:-HTML CSS JS

Title:- Blog Entry Layouts
Author:-Russ Beye
Made with:-HTML CSS JS

Title:- Card Design
Author:-Divya
Made with:-HTML CSS JS

Title:- Product Card
Author:-Arti Bhandari
Made with:-HTML CSS JS

Title:- Layout Practice, Using Grid
Author:-Bart Veneman
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

Learn CSS Animation with 100+ CodePen Examples
Bygscode September 13, 2023October 20, 2023

Want to take your CSS skills to the next level? Browse through 100+ awesome animation examples from CodePen creators and learn how to add engaging motion to your web projects. See the Pen 2020 SVG Animation by keyframers (@keyframers) on CodePen. Title:- 2020 SVG Animation Author:-@keyframers Made with:-HTML / CSS (SCSS) See the Pen Animated…

Read More Learn CSS Animation with 100+ CodePen Examples
CSS

45+ CSS Glow Effects (Updated)
Byfrontend November 16, 2023April 14, 2024

Explore a collection of 50 dazzling CSS Glow Effects examples to spark your developer creativity. See real-world applications and get inspired for your next web project. RELATED ARTICLES 1. Spinner With Glowing, Gooey Effect by Lou See the Pen Spinner With Glowing, Gooey Effect byhostsamurai(@hostsamurai) on CodePen. Author: Lou Links: Source Code / DemoMade with:…

Read More 45+ CSS Glow Effects (Updated)
CSS

CSS Blob Effects: 30+ Creative Ways to Use Blobs in Your Designs
Byfrontend October 18, 2023October 18, 2023

This collection of 24 CSS blob effects includes a variety of techniques, from simple to complex, that you can use to create unique and eye-catching designs. See the Pen CSS-only Blob Animation by marcossilva (@marcossilva) on CodePen. Title:- CSS-only Blob Animation Author:-Marcos Silva Made with:-HTML CSS See the Pen Blob Animation And Glassmorphism with CSS…

Read More CSS Blob Effects: 30+ Creative Ways to Use Blobs in Your Designs
CSS

Explore 5+ Interactive Periodic Tables in HTML & CSS
Byfrontend February 4, 2024February 4, 2024

Impress your clients with clean, efficient, and modern coding practices. Explore 5+ Periodic Tables in HTML & CSS best practices and code examples for professional developers. 1. Periodic Table of Type CSS Grid by Lindsay Grizzard See the Pen Periodic Table of Type CSS Grid bylindsayrusd(@lindsayrusd) on CodePen. Author: Lindsay Grizzard Links: Source Code /…

Read More Explore 5+ Interactive Periodic Tables in HTML & CSS
CSS

35+ JavaScript Notification Examples from Popular Developers in CodePen
Byfrontend October 18, 2023January 13, 2024

Learn how to use JavaScript notifications to improve user experience with these 35+ examples from popular developers in CodePen. 1. Pretty Notification Badges for menu by Ying Zhang See the Pen Pretty Notification Badges for menu bydodozhang21(@dodozhang21) on CodePen. Author: Ying Zhang Links: Source Code / DemoMade with: HTML CSS js 2. Radial Nav Menu…

Read More 35+ JavaScript Notification Examples from Popular Developers in CodePen
CSS

30+ Pure CSS Off Canvas Menu Navbar Example
Byfrontend February 16, 2024February 16, 2024

Discover 30+ pure CSS off-canvas menu examples, ready to elevate your UI/UX designs without JavaScript. Implement eye-catching effects, enhance responsiveness, and optimize performance. 1. Hidden Side Menu by Joshua Ward See the Pen Hidden Side Menu byjoshuaward(@joshuaward) on CodePen. Author: Joshua Ward Links: Source Code / DemoMade with: HTML CSS js 2. Offcanvas Sidebar Menu…

Read More 30+ Pure CSS Off Canvas Menu Navbar Example