Cool Checkbox With Svg
A custom checkbox that makes use of SVG to animate the tick inside of it.
Made with: HTML/Pug


Responsive Sidebar/Navbar
Vertical/Horizontal responsive sidebar/navbar.
Made with: HTML,CSS

Blockquote, Flexbox, Rgba, Before Content
Experimenting with various CSS techniques to help beginners experiment with positioning, colors, transparency, and Flexbox.
Made with: HTML,CSS

Dynamic Newspaper W/Css Grid
Automatically loads latest stories on refresh. Layout is done with CSS Grid. Built with HTML5, CSS3, JavaScript, jQuery and the News API.
Made with: HTML

Groovy Css Effect
1960's font effect using CSS text-shadow property along with SASS function and mixins to keep code DRY.
Made with: HTML (Pug),CSS (SCSS)

Hover Buttons
Experimenting with the CSS mix-blend-mode property.
Made with: HTML (Pug),CSS (SCSS)t

Sticky Navigation Menu With Smooth Scrolling
It's basically a template with couple of features like that are invoked on scroll - Shrink Header, addition of drop shadow. Other than that smooth scroll feature is also added to logo(scroll top top) and smooth scroll to section on clicking menu item.
Made with: HTML (Pug),CSS (SCSS),JS



Toggle Function & Smooth Scroll Pure Html & Css
Grid layout + details & summary + scroll-behavior. All in pure CSS3.
Made with: HTML,CSS







Snake Highlight
Slithering highlight in login form with anime.js.
Made with: HTML,CSS,JavaScript


