90 HTML, CSS and JavaScript codes

Js Parallax-1


Parallax is a visual effect achieved by moving elements at different speeds, creating an illusion of depth and perspective on a webpage.

Demo Code

Login Form


A login form in JavaScript typically consists of input fields for username and password, along with a submit button.

Demo Code

Js Parallax-2


Parallax is a web design effect that creates the illusion of depth by moving different elements on a page at different speeds.

Demo Code

Js Cards


JavaScript cards are a popular way to create interactive and dynamic content on websites. With JavaScript cards, making them highly flexible and suitable for a wide range of applications, such as news articles, or user profiles.

Demo Code

UI Tabs


Tab navigation is a user interface element that allows users to switch between different views or sections of a website or application.

Demo Code

Landing page


Landing pages are typically designed to be visually appealing and easy to navigate. They often use persuasive copy and call-to-action buttons to encourage visitors to take the desired action.

Demo Code

Image Slider


An image slider is a web page element that allows users to scroll through a series of images. It is typically used to display a portfolio of images, or to promote a product or service.

Demo Code

Card Expander


A card expander is a user interface element that allows users to expand and collapse content on a web page.

Demo Code

Curicular Nav


Curicular navigation bars are often used in educational settings, as they can help students to navigate through a course or curriculum.

Demo Code

Chat Bot


help chat bot is a software program that can answer questions and provide help to users. Help chat bots are typically powered by artificial intelligence (AI) and natural language processing (NLP) technology.

Demo Code

Calculator


A calculator is a device that performs mathematical calculations. It can be a handheld device or a software program. Handheld calculators are typically used for basic calculations, such as addition, subtraction, multiplication, and division.

Demo Code

Vertical Parallax


Vertical parallax is a visual effect that occurs when two objects of different heights are viewed from different angles. The closer object appears to move more quickly than the farther object.

Demo Code

Form Validation


Form validation is a process of checking the input data in a form to ensure that it is valid. This can include checking for required fields, correct data types, and valid values. Form validation is important to ensure that the data entered into a form is accurate and complete.

Demo Code

Profile Landing Page


The profile section is an important part of a landing page because it helps to provide context for the rest of the content on the page.

Demo Code

Portfilio Navigator


A portfolio navigator is a navigation tool commonly used in portfolio websites to allow visitors to easily browse through different sections. It provides a structured and intuitive way for users to explore the showcased work or content.

Demo Code

Animated Cards


Animated cards are a type of interactive content that can be used to add visual interest and engagement to a website or app. They can be used to display information, promote products or services, or simply entertain users.

Demo Code

ColorBlend


ColorBlend is a product color pickers are often used on e-commerce websites to allow customers to customize the appearance of products. They can also be used on websites that sell products that come in a variety of colors, such as clothing etc..

Demo Code

Parallax Fliping Card


Parallax flipping cards are a popular design element used by web developers to create engaging and interactive user experiences. They consist of a set of cards that, when clicked or hovered over, flip and reveal additional content on the backside.

Demo Code

AutoSlide Pro


Auto card section slide refers to a JavaScript-powered feature that automatically transitions and displays different sections or cards within a webpage. allow's users to effortlessly navigate through various card

Demo Code

GlowFX Button


Animated glow buttons are interactive UI elements that incorporate visual effects to attract attention and encourage user engagement.

Demo Code

QuoteQuest


Random quote generators are often used to add interest and variety to websites, blogs, and other online content. They can also be used to create inspirational quotes for social media posts or to help people find new quotes to read.

Demo Code

ColorBlend Challenger


A color matching game is an interactive and engaging experience where players are challenged to match colors accurately.

Demo Code

MilesWebSling


A Spiderman Landing page made with Spline is a website that uses the The landing page features a large image of Spiderman, as well as information about the movie, such as the release date, cast, and plot.

Demo Code

ColorCopy+


Color Extender is a helpful tool that allows users to explore and expand their color palette by generating complementary or analogous colors based on a chosen color. With a simple click, users can effortlessly copy the corresponding color code.

Demo Code

WelcomeScape


A welcome landing page is a website page that greets visitors and provides them with information about the website and its content. It is often the first page that visitors see when they arrive at a website, and it is important to make a good impression.

Demo Code

HoverNav


A hover navigation bar is a type of navigation bar that appears when the user hovers their mouse over the top of the screen.

Demo Code

ChillTunes


A chill music player is a software application that allows users to listen to music in a relaxing and calming environment.

Demo Code

JumpRush


A jumping game built by Javascript is a game where the player controls a character that jumps over obstacles. The goal of the game is to avoid the obstacles and reach the end of the level.

Demo Code

TypePro


TypingMaster JS: A dynamic and engaging game that enhances typing skills by challenging players to type accurately and swiftly, providing real-time feedback and progress tracking.

Demo Code

KeyQuest


EnterCode: A captivating game that tests your knowledge of ASCII values by challenging you to quickly identify and input the correct ASCII value of the Enter key, enhancing your understanding of character encoding.

Demo Code

404 Not Found-1


404 Page Not Found error occurs when a web server cannot locate the requested resource, leading to a customized error page displaying the issue.

Demo Code

404 Not Found-2


A 404 Page Not Found error occurs when a web server cannot locate the requested resource, often displayed as a custom error page on websites.

Demo Code

404 Not Found-3


A 404 Page Not Found error occurs when the requested web page or resource cannot be found on the server, often due to broken links or incorrect URLs. It is represented by the HTTP status code "404 Not Found."

Demo Code

Hover-click


Button-hover animation is a visual effect applied to buttons when users hover over them, creating an interactive and engaging user experience by providing visual feedback to the user's actions.

Demo Code

Login Form


A login page is a user interface screen that requests and verifies users' credentials, such as usernames and passwords, to grant access to a secure website, application, or system.

Demo Code

Scroll/Start Page


Scroll animation animates webpage elements based on user scrolling, adding dynamic user experiences. It's typically implemented using CSS and JavaScript.

Demo Code

BusHub


A bus landing page provides information about a bus service, including routes, schedules, and ticketing options. Its goal is to engage users and convert them into potential customers for the bus service.

Demo Code

Calculator UI


A calculator is a tool for performing mathematical computations and solving numerical problems.

Demo Code

Card Hover-1


Card hover is a web design effect where interactive elements, such as buttons or images, change their appearance or display additional information when the user hovers the mouse pointer over them.

Demo Code

Card Hover-2


Card hover is a web design effect where interactive elements, such as buttons or images, change appearance or display additional information when a user hovers their mouse pointer over them.

Demo Code

Card Hover-3


Card hover is a web design effect where interactive elements, such as buttons or images, change appearance or display additional information when the user hovers their mouse cursor over them.

Demo Code

Fliping Cards


Card flipping is a web design technique where elements, usually presented as cards, rotate or flip to reveal additional content or different sides when the user interacts with them, often achieved through CSS animations or transitions.

Demo Code

Card Hover-4


Card hover is a web design effect where additional information or interactive elements are revealed when a user hovers their mouse cursor over a card-like element, creating a dynamic and engaging user experience.

Demo Code

Hover Elements


Hover elements are interactive user interface elements that respond to the user's mouse cursor when it hovers over them, creating dynamic user experiences.

Demo Code

Image Slider


An image slider is a web design element that displays multiple images or slides in a rotating manner, commonly used to showcase content on a webpage.

Demo Code

Card Hover-5


Element hover is a web design effect where an element changes its appearance or behavior when a user hovers their mouse pointer over it, adding interactivity to the user interface.

Demo Code

Documentation


Documentation is the creation and maintenance of written records and guides, providing information and instructions about systems, products, or projects for effective communication and knowledge sharing.

Demo Code

Landing Page


A landing page is a standalone web page designed to capture visitor's attention and prompt them to take a specific action through a call-to-action (CTA).

Demo Code

Login/Sign page


A login/sign-in page is a secure webpage where users enter credentials to access a protected system, application, or website.

Demo Code

Login Page


A login page is a secure interface on a website or application that allows users to enter their credentials, such as usernames and passwords, to gain access to specific features or personalized content.

Demo Code

Chai Walla


The "MBA Chai Walla" landing page is a single webpage aimed at promoting or offering information about an MBA program or service, with a unique name that likely hints at a fusion of MBA education and the Indian term "Chai Walla" (tea seller).

Demo Code

Message Sender


A message sender is an entity that transmits messages or information to recipients through different communication channels like email, text messaging, or social media.

Demo Code

NaviBar


Compact UI with limited menu items, concise labels, and optional icons. Responsive and user-friendly, allowing seamless navigation. May include dropdowns for more options.

Demo Code

RadioSlider


A radio button slider is a user interface element that allows users to select a single option from a list by sliding through different choices horizontally or vertically, providing a visually appealing and interactive way to make selections.

Demo Code

AboutPage


The AboutPage is a web page that provides concise information about a person, company, or organization, highlighting key details, achievements, and values to introduce and engage visitors effectively.

Demo Code

ProfilePage


A web page that showcases an individual's or organization's information, achievements, and interests.

Demo Code

ServicesPage


A services landing page highlights and promotes specific products or offerings, aiming to convert visitors into customers through detailed information and persuasive content.

Demo Code

Sidebar


A side navigation bar is a vertical menu typically placed at the side of a webpage, used for easy access to different sections or pages of a website.

Demo Code

Survey Form

A survey form is a structured tool used to collect information and opinions from individuals, enabling data gathering for analysis and decision-making.

Demo Code

RailHub


A train landing page is a focused web page designed to convert visitors interested in train services by providing relevant information and enticing offers.

Demo Code

3D Bannaers


3D banners in web development add depth and visual engagement to websites by incorporating three-dimensional elements that capture user attention.

Demo Code

Card expander


A card expander in web development is a UI component that allows users to toggle or expand card-like elements to reveal additional content or details within a webpage.

Demo Code

Color theam changer


A color theme changer is a feature used in web development to dynamically switch between different color schemes for a website's user interface.

Demo Code

Card Hovers


Card hovers in web development involve interactive design elements that dynamically respond to user actions, such as hovering the mouse over a card, often revealing additional information or animations.

Demo Code

Directional Cursor


A directional cursor in web development refers to a user interface element that changes the cursor's appearance based on the direction in which an element, typically a slider or scroller, can be interacted with.

Demo Code

Drawing Code


Drawing code in web development involves using technologies like HTML5 Canvas or SVG to create dynamic visual content directly within a web page.

Demo Code

Exanding card


An expanding card in web development refers to a user interface element that expands or reveals additional content when clicked or hovered over, often used for presenting summarized information or options.

Demo Code

FAQ


An expanding FAQ card in web development is a user interface element that, when clicked, reveals additional information for a frequently asked question, helping to keep the interface clean and organized.

Demo Code

Fluid cursor


A fluid cursor in web design refers to a dynamic and interactive cursor that changes shape, size, or behavior to enhance user experience and engagement.

Demo Code

Glass navi


A "glass navi" in web design typically refers to a navigation menu with a transparent or frosted glass-like effect, adding a modern and visually appealing element to the user interface.

Demo Code

Horizontal slider


A horizontal slider in web development is a interactive UI component that allows users to navigate or scroll through content horizontally, often used to showcase images, products, or other information in a visually engaging manner.

Demo Code

Image Landing Page


An image landing page in web design is a visually focused webpage that uses compelling images to capture the visitor's attention and communicate the essence of a brand, product, or concept quickly and effectively.

Demo Code

India Flag


Creating an accurate representation of the Indian flag in web development requires careful consideration of its proportions and design.

Demo Code

Landing Page


A landing page is a standalone web page designed with a specific goal, often focused on capturing user interest, promoting a product or service, and encouraging specific actions like signing up or making a purchase.

Demo Code

Link Hover animation


Link hover animation is a dynamic web design effect that triggers visual changes to a link when a user hovers their cursor over it, enhancing interactivity and user experience.

Demo Code

Login/Sing up Form


A login/signup form is a crucial web interface element that enables users to access or create accounts, providing secure authentication and personalized interactions within a website or application.

Demo Code

Marquee Image Slider


A marquee image slider is a web design element that displays a sequence of images in a continuous loop, creating a scrolling or sliding effect to showcase content in an engaging and dynamic manner.

Demo Code

Card-hover


Card-hover is a web design interaction where user actions like hovering the cursor over a card element trigger visual transformations, revealing additional information or effects to enhance the user's engagement and understanding of the content.

Demo Code

Navigation Bar


A navigation bar, often referred to as a "navbar," is a fundamental user interface component in web design that provides links to different sections or pages of a website, enabling users to easily navigate and access content.

Demo Code

Landing Page


A landing page content background video is a multimedia element that plays a video in the background of the landing page, helping to captivate visitors' attention and convey information in a visually engaging way.

Demo Code

Font Generator


A font generator is a tool that allows users to create custom fonts or modify existing ones, providing a versatile way to stylize text for various design projects.

Demo Code

Spotify UI Clone


A Spotify UI clone is a web development project that replicates the user interface of the Spotify music streaming application, often used to practice coding skills and showcase design abilities.

Demo Code

Sprinkel cursor


A sprinkling cursor is a creative web design effect where the cursor leaves behind a trail of animated particles or elements, adding an interactive and playful dimension to user interactions.

Demo Code

Sprinkle cursor


A sprinkle cursor is a whimsical web design feature where the cursor leaves a trail of animated sprinkles or particles as it moves, adding a playful and interactive element to the user experience.

Demo Code

Stacking cards


Stacking cards is a design technique where multiple content cards are arranged in a visually pleasing manner, often with overlapping or staggered placements, to create a dynamic and organized presentation of information on a webpage.

Demo Code

Landing Page


A landing page is a single web page designed with a specific goal to guide user actions, typically centered around conversions, such as sign-ups, purchases, or inquiries.

Demo Code

UI Card Hovers


UI card hovers are interactive web design effects where hovering over a card element triggers visual changes or animations, providing users with additional information and enhancing engagement.

Demo Code

UI Cards


UI cards are modular elements in web design used to present specific information or content concisely, enhancing visual appeal and user experience on a website or application.

Demo Code

Auto Image Filter


Auto image filter automatically adjusts or enhances the appearance of images using algorithms, enhancing visual quality and aesthetics without manual editing.

Demo Code

Circular Testimonial


Circular testimonial reveal is a web design element where testimonials or feedback content is presented in a circular arrangement, allowing users to reveal and read individual testimonials through interactive rotation.

Demo Code