Introduction The idea of Fluid Typography has been around for quite some time. It is about scaling the font-size up or down depending on the…
Pure CSS Hamburger Menu
Introduction Have you ever come to the situation where you just need a hamburger menu icon for your website, but don’t want to import the…
UI animation in CSS
Introduction In the last tutorial UI Animation in Adobe XD we explained the concept behind animations and went over the necessary steps to create them…
How to create Light / Dark mode toggle with CSS and Javascript
Introduction As dark mode becomes one of the major trends in 2020, more and more people start to integrate dark mode into their new projects…
Reduce CSS Code with the :is Selector
Introduction In CSS, a lot of the time when we want to give children elements under the same parent the same CSS property, we will…
Drop-Shadow – Apply Shadow on Irregular Shape
Introduction If you have been working with CSS for a while, then you might have encountered scenarios where you need to apply shadow on HTML…
Masonry (Waterfall) Layout with Pure CSS
What is Masonry Layout? Masonry layout, also known as Waterfall layout, is a popular way to display images of different sizes together nowaday. Even though…
Applying CSS Animation on Text Elements
Introduction Have you ever wondered how the Neon light effect like the image above is achieved? Well before you jump to the conclusion of using…
Glassmorphism Credit Card with Pure CSS
Introduction As 2020 comes to an end, new UI trends for 2021 starts to appear and one of the coolest trends for 2021 is the…