Category: Code Snippets

All code snippets related to UI development or Front-end Development. It is the parent category to other code categories.

Gradient loader animation with html and css only

Code Snippets, CSS, CSS Animations

Here is a very simple example with a demo and source code for making a cool loader animation with a gradient. See the Pen loading-animation-gradient by Puneet Sharma (@webdevpuneet) on CodePen.

Matrix rain drop 01 digit code

Code Snippets, CSS Animations, JavaScript

Here is a code with a demo for matrix raindrop-like animation from top to bottom with 0 and 1 as its digits. DEMO See the Pen Untitled by Puneet Sharma (@webdevpuneet) on CodePen. HTML <canvas class=”canvas”> Code // Initialising the canvas var canvas =...

Responsive Media Queries – CSS

Code Snippets, CSS

@media (max-width:1800px) { } @media (max-width:1400px) { } @media (max-width:1300px) { } @media (max-width: 1199.98px) { } @media (max-width: 1199.98px) { } @media (max-width: 991.98px) { } @media (max-width: 767.98px) { } @media (max-width: 575.98px) {...

Category: Code Snippets

Gradient loader animation with html and css only

Matrix rain drop 01 digit code

Responsive Media Queries – CSS

Code for GSAP SplitText plugin

Replace all images with .svg extension with SVG code and retain image’s classes

Replace an SVG image by SVG code – Script