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

25+ Creating Stunning CSS Text Shadows for Your Website
Byfrontend May 16, 2021October 17, 2023

The CSS text-shadow the property adds a shadow effect to the text. It takes values for the horizontal offset, vertical offset, blur radius, and shadow color. Example: In this example, the text-shadow the property adds a 2px horizontal shadow 2px to the right, a 2px vertical shadow 2px down, and a 2px blurred shadow with…

Read More 25+ Creating Stunning CSS Text Shadows for Your Website
CSS

50+ Modern CSS Footer: The Ultimate Collection for 2024
Byfrontend February 3, 2024February 3, 2024

Find the perfect modern CSS footer for your website from our curated selection of 50+ stunning and responsive examples 1. Free Tailwind CSS Footers Component by Harris# See the Pen Free Tailwind CSS Footers Component byHarishash(@Harishash) on CodePen. Author: Harris# Links: Source Code / DemoMade with: HTML CSS 2. Autoupdating Current Year by David See…

Read More 50+ Modern CSS Footer: The Ultimate Collection for 2024
CSS

How to Create a React Calculators (with 15+ Great Examples)
Byfrontend October 18, 2023October 18, 2023

The React calculator is a simple, easy-to-use calculator that supports all of the common mathematical functions. It’s also highly customization and can be used as a component in your React apps. See the Pen React Calculator by Michael Jackson (@mjijackson) on CodePen. Title:- React CalculatorAuthor:- Michael JacksonMade With:- REACT See the Pen React Calculator by…

Read More How to Create a React Calculators (with 15+ Great Examples)
CSS

10+ Best Parallax Animation Example
Byfrontend October 18, 2023December 31, 2024

See the Pen vNNzyG by carpenumidium (@carpenumidium) Author: carpenumidium (@carpenumidium) Links: Source Made with: HTML, CSS, JavaScript See the Pen dyOxxGb by creativeocean (@creativeocean) Author: creativeocean (@creativeocean) Links: Source Made with: HTML, CSS, JavaScript See the Pen wLdoxB by elecweb (@elecweb) Author: elecweb (@elecweb) Links: Source Made with: HTML, CSS, JavaScript See the Pen LYPGxQz…

Read More 10+ Best Parallax Animation Example
CSS

Top 40+ Best CSS Glass Morphism from CodePen
Byfrontend October 18, 2023October 18, 2023

I’m sure you are familiar with CodePen. It’s a great place to create and share CSS code snippets. I’ve been using it for a long time and have learned a lot about prototyping images and creating other UI elements. If you’re interested in learning new methods of CSS development, then check out 40+ Best CSS…

Read More Top 40+ Best CSS Glass Morphism from CodePen
CSS

50+ CSS grid template
Byfrontend May 27, 2020October 17, 2023

CSS Grid Layout with grid-template-columns: repeat(); Author Stacy Made With HTML,CSS(SCSS) Demo Check Out Demo Links Download Monopoly board Author John Coppola Made With HTML,CSS(SCSS) Demo Check Out Demo Links Download CSS-Grid Gantt Chart Author Phil Made With HTML,CSS(SCSS) Demo Check Out Demo Links Download Comic book style layout with CSS Grid Author Aysha Anggraini…

Read More 50+ CSS grid template