diff options
| author | MacDue <macdue@dueutil.tech> | 2022-12-03 00:06:21 +0000 |
|---|---|---|
| committer | Tim Flynn <trflynn89@pm.me> | 2022-12-03 09:06:51 -0500 |
| commit | cdf6e568f64bc9f72c08d1034ee6bfd6fc7195f2 (patch) | |
| tree | d5a78afe117bdaf5047302636e9f2c1dd4cc24d3 | |
| parent | 28028be2fc63c153643fa3c0e0c30af352c8c348 (diff) | |
| download | serenity-cdf6e568f64bc9f72c08d1034ee6bfd6fc7195f2.zip | |
Base: Add some `repeating-radial-gradient()` HTML examples
| -rw-r--r-- | Base/res/html/misc/gradients.html | 16 |
1 files changed, 16 insertions, 0 deletions
diff --git a/Base/res/html/misc/gradients.html b/Base/res/html/misc/gradients.html index 2a9a9ef1d9..87c0f58458 100644 --- a/Base/res/html/misc/gradients.html +++ b/Base/res/html/misc/gradients.html @@ -198,6 +198,18 @@ .grad-radial-4 { background-image: radial-gradient(200px 100px ellipse at 25% 50%, yellow, #009966, purple); } + + .grad-radial-repeat-1 { + background-image: repeating-radial-gradient(#e66465, #9198e5 20%); + } + + .grad-radial-repeat-2 { + background-image: repeating-radial-gradient(closest-side, #3f87a6, #ebf8e1, #f69d3c); + } + + .grad-radial-repeat-3 { + background-image: repeating-radial-gradient(circle at 100%, #333, #333 10px, #eee 10px, #eee 20px); + } </style> </head> <body> @@ -253,6 +265,10 @@ <div class="rect grad-radial-2"></div> <div class="rect grad-radial-3"></div> <div class="rect grad-radial-4"></div> + <b>Repeating radial gradients</b><br> + <div class="rect grad-radial-repeat-1"></div> + <div class="rect grad-radial-repeat-2"></div> + <div class="rect grad-radial-repeat-3"></div> </body> <script> const boxes = document.querySelectorAll(".box, .rect"); |