A CSS-based background grid generator

A month ago, I was searching for a CSS generator to create a CSS grid background for a blog post component. 👇

I knew creating this CSS effect wouldn't be too hard, but fiddling with CSS gradients is not my strong suit. Unfortunately, my Google foo failed me. And if your search terms include "CSS" and "grid" you'll get only tutorials to use and create "CSS grids". 🤦‍♂️

The only solution was to tweak random Codepens, and I spent a good half an hour creating vertical and horizontal lines in CSS.

So! If you, dear reader, are on the hunt for a quick CSS background grid generator, you reached your final destination!

Here's my contribution to the internet. 👇

.background-grid {
  background-image: linear-gradient(#1c7cbb 1.5px, transparent 1.5px, transparent calc(100% - 1.5px), #1c7cbb calc(100% - 1.5px)), linear-gradient(90deg, #1c7cbb 1.5px, transparent 1.5px, transparent calc(100% - 1.5px), #1c7cbb calc(100% - 1.5px));
  background-size: 10% 10%;
  border: 1.5px solid #1c7cbb;
}