Blur effect landing page with CSS Grid -1

CSS Grid

Welcome to a brand new series, where we are going to build an elegant landing page with Blur effect. We are going to use CSS Grid for this project.

So, let’s open the terminal and create a new folder Blur_Landing and create two files index.html and style.css inside it.


Next, we are adding a logo and a background image in the same folder. Open the folder in VS Code.

VS Code

You can read the whole blog from my site. The link for the same is below.

You can find part-2 here.




Founder TWD, JavaScript & ReactJS Trainer, Youtuber, Blogger

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Building your API Stack

TotemFi’s Mooncaster With Privi $PIX is Now Open

Thoughts about Microservices — Problem domain

M2Det : Highly Accurate Object Detection Model

9 tips that made me speed up my workflow as a front-end developer

How to install Sonarqube on AWS EC2

Zycus PDT Hiring Freshers For Software Engineer Position | Apply Now

Data structures from scratch- Bot-up series #5[Prerequisites for data structures II]

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Nabendu Biswas

Nabendu Biswas

Founder TWD, JavaScript & ReactJS Trainer, Youtuber, Blogger

More from Medium

My First Project Using An API

Top 3 ways to easily detect when a user leaves a page using JavaScript


APIs and innerHTML

Console log in the browser