diff --git a/tests/examples/wibox/widget/background/bg.lua b/tests/examples/wibox/widget/background/bg.lua
new file mode 100644
index 000000000..f6562a6cf
--- /dev/null
+++ b/tests/examples/wibox/widget/background/bg.lua
@@ -0,0 +1,27 @@
+local parent = ... --DOC_HIDE
+local wibox  = require("wibox") --DOC_HIDE
+
+local text_widget = {
+    text   = "Hello world!",
+    widget = wibox.widget.textbox
+}
+ 
+parent : setup {
+    {
+        text_widget,
+        bg     = '#ff0000',
+        widget = wibox.widget.background
+    },
+    {
+        text_widget,
+        bg     = '#00ff00',
+        widget = wibox.widget.background
+    },
+    {
+        text_widget,
+        bg     = '#0000ff',
+        widget = wibox.widget.background
+    },
+    spacing = 10,
+    layout  = wibox.layout.fixed.vertical
+}
diff --git a/tests/examples/wibox/widget/background/clip.lua b/tests/examples/wibox/widget/background/clip.lua
new file mode 100644
index 000000000..15bdb15e3
--- /dev/null
+++ b/tests/examples/wibox/widget/background/clip.lua
@@ -0,0 +1,32 @@
+local parent    = ... --DOC_HIDE
+local wibox     = require("wibox") --DOC_HIDE
+local gears     = {shape = require("gears.shape")} --DOC_HIDE
+local beautiful = require("beautiful") --DOC_HIDE
+
+parent : setup {
+    {
+        -- Some content may be outside of the shape
+        {
+            text   = "Hello\nworld!",
+            widget = wibox.widget.textbox
+        },
+        shape              = gears.shape.circle,
+        bg                 = beautiful.bg_normal,
+        shape_border_color = beautiful.border_color,
+        widget             = wibox.widget.background
+    },
+    {
+        -- To solve this, clip the content
+        {
+            text   = "Hello\nworld!",
+            widget = wibox.widget.textbox
+        },
+        shape_clip         = true,
+        shape              = gears.shape.circle,
+        bg                 = beautiful.bg_normal,
+        shape_border_color = beautiful.border_color,
+        widget             = wibox.widget.background
+    },
+    spacing = 10,
+    layout  = wibox.layout.fixed.vertical
+}
diff --git a/tests/examples/wibox/widget/background/fg.lua b/tests/examples/wibox/widget/background/fg.lua
new file mode 100644
index 000000000..98a889c53
--- /dev/null
+++ b/tests/examples/wibox/widget/background/fg.lua
@@ -0,0 +1,27 @@
+local parent = ... --DOC_HIDE
+local wibox  = require("wibox") --DOC_HIDE
+
+local text_widget = {
+    text   = "Hello world!",
+    widget = wibox.widget.textbox
+}
+ 
+parent : setup {
+    {
+        text_widget,
+        fg     = '#ff0000',
+        widget = wibox.widget.background
+    },
+    {
+        text_widget,
+        fg     = '#00ff00',
+        widget = wibox.widget.background
+    },
+    {
+        text_widget,
+        fg     = '#0000ff',
+        widget = wibox.widget.background
+    },
+    spacing = 10,
+    layout  = wibox.layout.fixed.vertical
+}
diff --git a/tests/examples/wibox/widget/background/shape.lua b/tests/examples/wibox/widget/background/shape.lua
new file mode 100644
index 000000000..e8c16361b
--- /dev/null
+++ b/tests/examples/wibox/widget/background/shape.lua
@@ -0,0 +1,40 @@
+local parent    = ... --DOC_HIDE
+local wibox     = require("wibox") --DOC_HIDE
+local gears     = {shape = require("gears.shape")} --DOC_HIDE
+local beautiful = require("beautiful") --DOC_HIDE
+
+parent : setup {
+    {
+        -- Adding a shape without margin may result in cropped output
+        {
+            text   = "Hello world!",
+            widget = wibox.widget.textbox
+        },
+        shape              = gears.shape.hexagon,
+        bg                 = beautiful.bg_normal,
+        shape_border_color = beautiful.border_color,
+        shape_border_width = beautiful.border_width,
+        widget             = wibox.widget.background
+    },
+    {
+        -- To solve this, use a margin
+        {
+            {
+                text   = "Hello world!",
+                widget = wibox.widget.textbox
+            },
+            left   = 10,
+            right  = 10,
+            top    = 3,
+            bottom = 3,
+            widget = wibox.layout.margin
+        },
+        shape              = gears.shape.hexagon,
+        bg                 = beautiful.bg_normal,
+        shape_border_color = beautiful.border_color,
+        shape_border_width = beautiful.border_width,
+        widget             = wibox.widget.background
+    },
+    spacing = 10,
+    layout  = wibox.layout.fixed.vertical
+}