Background Color is clippable?

[noob_user]

So I made a empty widget and started adjusting its Style Sheet properties while following a tutorial and I did not get the expected result.

the objective of this snippet should be to create a red hexagon with a white background.

code:

background: red;
width: 100px;
height: 100px;
clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 025%);

background: red;
width: 100px;
height: 100px;
clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 025%);

To copy to clipboard, switch view to plain text mode 

however the code snippet does not clip anything and the widget results in being all red.

is there a way to achieve the desired result?

Why I was following this tutorial:
I was trying to create some sort of polygon area to clip the background-color of my widget.

Thank you for any help in advance