For anyone interested, I created a div block 30px x 30px (which will be the wrapper of the whole thing) - *you can use any dimensions you want* - with a gradient fill (that will contain the color of the border). The gradient fill should look like this: at 0% your preferred color with 100% transparency at 90% your preferred color with 100% transparency at 95% your preferred color with 0% transparency at 100% your preferred color with 0% transparency Lastly add a 225% degree angle to the gradient and you're done with the border. Then inside that border add a text block or a div block with the color of the background. Play with dimensions until everything fills in place exactly as the main div. For me 27px x 27px did the trick. Then use the same gradient values as before. That's it.

corner, div, sharp