SVG_fundamentals
This example demonstrates two SVG rectangles with rounded corners, each filled using a linear gradient. The first rectangle uses a gradient defined by CSS classes within the SVG `<style>` block, while the second uses an inline gradient definition. Both gradients transition from red through transparent black to blue. The code relies on native SVG elements (`<defs>`, `<linearGradient>`, `<stop>`, `<rect>`) and CSS styling, with no external JavaScript libraries. The rendering is pure SVG embedded directly in the HTML document.