<!DOCTYPE html> <meta charset="utf-8"> <title>reference: 0.8 opacity green circle</title> <style> body { margin: 0; } div { margin: 100px 200px; width: 200px; height: 200px; background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 200 200"><circle cx="100" cy="100" r="100" fill="green" fill-opacity="0.8"/></svg>'); } </style> <div></div>