A nice way to create your background image

matteo

Create an SVG picture with the background, here are some options:
- Go to bbblurry and create some dots on a canvas and copy the resulting .svg
- Use Inkscape and draw some circles, light colors or low alpha, blur to >90, as you like. Save the .svg as "Plain SVG", open it in a text editor and copy the text starting with the opening <svg>-tag
Go to SVG to CSS and enter the resulting svg into the "SVG Input" make it a background-image
Export it through the "Basic background-image"-mode and copy it to your CSS

Wrap it into a body tag like this:

body {
  background-image: url('...');
}

matteo

Honestly, I just replaces bbblurry with Inkscape, works even better as I'm not limited in page size + ratio.

laurdit

That’s a great workaround, Matteo. Using Inkscape does seem more flexible, especially if you're working with custom dimensions or need more control over the design. Do you export as SVG directly from Inkscape and then run it through the same SVG to CSS tool, or do you handle the CSS manually afterward?

matteo

laurdit Thanks for the question! I copy the SVG from the saved .svg file, excluding the stuff in the beginning like<?xml version="1.0" encoding="UTF-8" standalone="no"?> and comments. I don't think Inkscape has the option to just copy the SVG-gode.

I added more details above, let me know if you have more questions!