Rustcode

Profile-Card-Design

When we design any websites, we need to design a profile page, which is contained the profile card. Apart from this, we design a profile card of our clients, users, employees to show the profile of them. For an attractive website ui design, we need to design an attractive profile card with various animation effects. Here I am going to design a profile card. This profile card is very simple and attractive, does not contain too many effects.

CSS • 8 stars

Modern-Website-Landing-Page

HTML • 4 stars

Cursor-Animation-With-Hover-Effect-Using-GSAP

CSS • 2 stars

Link-Hover-Effect-With-Svg-Using-Html-And-Css-Only

CSS • 2 stars

Animated-Search-Box

CSS • 1 star

Automatic-And-ManualResponsive-Image-Slider

CSS • 1 star

Coming-Soon-Website-Template

CSS • 1 star

Comment-Card-Design-Html-Css-And-Bootstrap

HTML • 1 star

credit-card-design

CSS • 1 star

Gaming-CPU-Landing-Page-Design-Using-GSAP

CSS • 1 star

Grid-Layout-Responsive-Website-Design

CSS • 1 star

How-to-convert-text-or-link-into-QR-code

CSS • 1 star

Image-Transition-Effect-On-Hover

CSS • 1 star

Modern-Salon-Website-Landing-Page

we will design a landing page, for its structure we used the "flex-box" concept. Apart from this, we also put some animations on this landing page. To add animations, we used JavaScript libraries like gsap, lettering.js, jquery, textillate.js, and animation.css. This video will give you enough information about how to design a landing page with the proper structuring of each element.

JavaScript • 1 star

Multiple-Overlay-Animation-On-Image

CSS • 1 star

Navigation-Bar-With-Hover-Line-Effect

HTML • 1 star

OTP-Verification-Card-Design

HTML • 1 star

Particle-Background-Animation

HTML • 1 star

Profile-Card-Skeleton-Screen

"Profile Card Skeleton Screen" is a general animation that is usually used by a lot of websites like news, social media websites. In this effect, a loading bar appears instead of the website content and a skeleton screen appears until the entire website content is loaded.

HTML • 1 star

Pure-Css-Sticky-Navigation-Bar

HTML • 1 star

Pure-Css-Typewriter-Effect

CSS • 1 star

Simple-Button-Group-Deisgn

CSS • 1 star

Simple-Search-box

HTML • 1 star

3D-Flip-Image-Effect-On-Hover

CSS

3D-Layer-Hover-Effect-On-Image

CSS

404-Error-Page-Design

The page with "Error 404 Page Not Found" must have been seen on some website. This page contains three buttons and have one simple image.

HTML

Adding-Input-Dynamically-To-Form

CSS

Alert-Strips

HTML

Animated-Button-With-Pressed-Effect

HTML

Animated-Side-Navigation

HTML

Announcement-Popup-Box-Design

HTML

Attractive-Profile-Card-Design

CSS

Back-To-Top-Button

CSS

Blog-Card-Design

CSS

Blurred-Image-Background

CSS

Bookmark-Interaction-Animation-Using-Html-And-Css-And-Gsap

HTML

Button-Border-Animation-On-Hover

CSS

Button-With-Fill-Animation

CSS

Captain-America-Shield-Design

CSS

Center-Alignment-Of-Elements

CSS

Code-Snippets-Syntax-Highlighting

HTML

Contact-Us-Page-Design

CSS

Cookies-Card-Design

CSS

Copy-To-Clipboard-Animation

CSS

Course-Card-Design

CSS

Custom-Cursor-Design

CSS

Custom-Srollbar-design

CSS

Cutout-Text-Effect

CSS

Digital-Clock-With-JavaScript

CSS

FAQ-Accordion-Design

HTML

Fixed-Responsive-Dropdown-Navigation-Bar-With-Logo

CSS

Floating-Social-Media-Icons

HTML

Follow-Us-On-Social-Media

CSS

Full-Screen-Overlay-Responsive-Navigation-Bar

CSS

Full-Screen-Overlay-Responsive-Navigation-Bar-Using-gsap

CSS

Glitch-Effect-On-Image-mgGlitchJS

HTML

Glitch-Effect-On-Text

CSS

Glowing-Neon-Light-Button-Animation

CSS

Gsap-Text-Reveal-Animation

CSS

Hamburger-Menu-Icon-Animation

CSS

Happy-Diwali-Card-Design-Using-Html-Css-And-Gsap

JavaScript

Html-Elements-Smooth-Drag-And-Drop-Animation-Using-Html-Css-And-Sortable

HTML

Image-Drag-And-Drop-Animation

CSS

Image-Overlay-Effect-On-Hover

CSS

Image-Vertical-Splitting-On-Hover

CSS

Image-Zoom-On-Hover

CSS

Laptop-Ecommerce-Card-Design

HTML

Liquid-Distortion-Effect-On-Text

JavaScript

Login-Page-Design

CSS

Minimalist-Navigation-With-Flash-Effect

CSS

Mobile-App-Download-Link-Design

CSS

Modal-Box-Animation

CSS

Navigation-Bar-With-Hover-Effect

CSS

Neumorphism-Effect

CSS

Next-Button-Design

CSS

Next-Page-Link-Animation-On-Hover

CSS

Notification-Bell-Icon-Ripple-Animation

CSS

Notification-Button-Design

CSS

Notification-Card-Design

CSS

Page-Loading-With-Intro-Using-GSAP

CSS

page-scrolling-indicator

HTML

Page-Transition-Animation-Using-GSAP

HTML

Photographer-Studio-Website-Landing-Page

CSS

Pill-Styled-Radio-Button

CSS

Preloader-Loading-Animation-Using-Html-Css-And-Gsap

Preloader Loading Animation Using Html, Css And Gsap. A preloader is a web user interface that displays while a web page, content is loading.

CSS

Progress-Percentage-Circle-Design

CSS

Pure-Css-Dot-Loader-Animation

CSS

Pure-Css-Facebook-Logo-Design

CSS

pure-css-progress-bar-animation-html-and-css

CSS

pure-css-side-navigation-bar-design

CSS

Pure-Css-To-Do-List-With-Checkbox

CSS

Responsive-Automatic-Image-Slider

HTML

Responsive-Column-With-Equal-Height

HTML

Responsive-Image-Slider

CSS

Responsive-Newsletter-Subscription-Form-Design

CSS

Responsive-Portfolio-Landing-Page-Design-With-Animation

CSS

Responsive-Price-Table

HTML

Responsive-Profile-Card-Ui-Using-Html-Css

CSS

Responsive-Skill-Bar-Design

CSS

Rotating-Boxes-Website-Loader

CSS

Round-Switch-Button-Design

CSS

Scroll-Progress-Bar-JsPlugin

JavaScript

shining-effect-on-text

CSS

Show-And-Hide-Password-Animation

CSS

Simple-Blogging-Template-Design

HTML

Simple-Login-Form-Design

CSS

Simple-Login-System-Design-Using-PHP-And-MySql-Database

HTML

Simple-Preloder

CSS

Simple-Star-Rating-Icons

star rating very important component of the website. Because star rating helps to improve better service and product.

HTML

Single-Page-Website-Design

CSS

Skewed-Background

HTML

Smooth-Parallax-Scrolling-Effects

HTML

Snackbar-Animation-Design

CSS

Social-Media-Buttons-Animation-With-Rotation-Hover-Effect

CSS

Social-Media-Buttons-with-Hover-Effect-in-Html-Css-

CSS

sort-alphabetically-html-unordered-elements-using-javascript

CSS

Split-Image-On-Hover

CSS

Swap-Image-On-hover

CSS

Tooltip-Text

HTML

Transparent-Navigation-Bar

CSS

Two-Element-Slider

HTML

User-Profile-Card-Design

CSS

Weather-Report-Card

HTML

Weather-Report-Card-Design

HTML

Website-Loader-Animation-Using-GSAP

CSS