You might need to know this someday: you can style a div, put the div into SVG, then put the SVG in to CSS and use it as a repeating background.

Frontend Masters is an online learning platform offering  courses on frontend development technologies such as JavaScript, HTML, CSS, React, and Vue.js. Readers can learn about advanced frontend concepts, best practices, and modern development workflows from industry experts. With video lectures, exercises, and real-world projects, Frontend Masters provides  guidance and expertise for mastering frontend development skills.

Frontend Masters

CSS's `corner-shape` property can create interesting background patterns by styling HTML elements with properties like `scoop`, `notch`, and `superellipse()`, then embedding them into SVG via `foreignObject`, and using that SVG as a repeating CSS background through data URLs. The technique combines `corner-shape` with `border-radius` to control corner form and size, and can be enhanced with transforms, gradients, borders, and shadows for varied designs. Browser support can be handled with `@supports` feature queries.

Background Patterns with CSS `corner-radius` – Frontend Masters Blog