Create polka dot background via radial-gradient

| Tag css  gradient  
body {
  background-color: var(--background);
  background-image: radial-gradient(var(--accent) .75px, transparent .75px);
  background-size: 15px 15px;
}

See Pen KKJvraL

See radial-gradient on MDN

<html>
<head>
  <title>CSS Grid layout</title>
</head>
<body>
  content
</body>
</html>

body {
  --background: lightyellow;
  --accent: green;
}

body {
  background-color: var(--background);
  background-image: radial-gradient(var(--accent) .75px, transparent .75px);
  background-size: 15px 15px;
}

Prev     Next