diff --git a/Base/res/html/misc/border-radius.html b/Base/res/html/misc/border-radius.html
index 52b524f3a2..938189f25d 100644
--- a/Base/res/html/misc/border-radius.html
+++ b/Base/res/html/misc/border-radius.html
@@ -180,6 +180,29 @@
border: 1px solid black;
background-color: transparent;
}
+
+ .nut {
+ width: 220px;
+ height: 180px;
+ background-size: 220px 180px;
+ border-radius: 70% 30% 30% 70% / 60% 40% 60% 40%;
+ background-image: url('old-computer.png');
+ }
+
+ .screenshot {
+ width: 100px;
+ height: 100px;
+ border-radius: 50%;
+ background-image: url("serenity-screenshot.png");
+ }
+
+ .rounded-image {
+ background-image: url("90s-bg.png");
+ background-repeat: repeat;
+ border-radius: 20px;
+ width: 150px;
+ height: 100px;
+ }
@@ -239,6 +262,18 @@
+
These boxes have (rectangular) background images, that are clipped by the border radius
+ In a nutshell + +The boxes are 50x50px
All round 10px diff --git a/Base/res/html/misc/old-computer.png b/Base/res/html/misc/old-computer.png new file mode 100644 index 0000000000..9dcee69390 Binary files /dev/null and b/Base/res/html/misc/old-computer.png differ