Thanos Snap Effect Using HTML and CSS

Most of us have watched the movie Avengers : Infinity War where Thanos had killed half of the universe with just one snap. Here, in this tutorial we will be creating the... Read more »

How to create Sticky Navbar on scroll

In this article, we are going to create a sticky navbar that sticks to the top of webpage when we reach its scroll position. Source Code <style type="text/css"> body{ background-color: #aacad6; margin:0;... Read more »

How to make Breadcrumb using HTML and CSS

Breadcrumb indicates the current page’s location within a navigational hierarchy that automatically adds separators via CSS. A simple HTML / CSS breadcrumb can be designed with the following code : <style> ul.bread{... Read more »

OnlineKart – Free Responsive Single Page Product Showcase Website Template

OnlineKart Shop is a free HTML template designed especially for showcasing list of products for sale in the webpage. Your users will have a better experience regardless of the device they are... Read more »

Facebook Style Login Page Design using HTML and CSS

Facebook is an American online social media and social networking service based in Menlo Park, California, and a flagship service of the namesake company Facebook, Inc. It was founded by Mark Zuckerberg,... Read more »

Rotating 3D Cube effect using HTML and CSS

In this article, we are going to learn to make 3D Cube using HTML and CSS and then rotate it using css transform property.   Full Source Code : <html> <head> <style... Read more »

Notebook design using HTML & CSS

The following source code provides few lines of HTML and CSS which creates a simple yet pretty looks of a notepad.   Source Code : <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Shadows+Into+Light'> <style> body { background:#000;... Read more »

Create Marquee in webpage using CSS

Marquee is an animation effect for web pages used to create horizontal or vertical scrolling text and images. The <marquee> element of HTML is not a standard-compliant, ie the element is not... Read more »

Skeleton Loading Screen Animation using HTML and CSS

Skeleton screens are blank pages that are progressively populated with content, such as text and images, as they become available (i.e. when network latency allows). Grey or neutral-toned filled shapes, commonly called... Read more »

Create Custom Music Player using HTML, CSS and JavaScript

In this article, we are going to learn to develop a custom music player using HTML, CSS and JavsScript (preferably JQuery). Full Source Code : <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta... Read more »