Extruded container effect

A few weeks ago I was looking for a way to create a 3D, cube extruded-looking effect in place of a drop shadow or something similar, but found nothing and decided to create my own. It uses some basic CSS3 transformations to get the angled effect and a really cool tint function to "shade" the additional sides relative to the color of the container the effect applies to.

The source is available on GitHub , and below is an example of the code in use.

The rest of the site (theme included) is a work in progress, don't pay attention to my shitty padding and buttons :tongue:

(10-12-2017, 05:23 AM)Inori Wrote:

[To see links please register here]

A few weeks ago I was looking for a way to create a 3D, cube extruded-looking effect in place of a drop shadow or something similar, but found nothing and decided to create my own. It uses some basic CSS3 transformations to get the angled effect and a really cool tint function to "shade" the additional sides relative to the color of the container the effect applies to.

The source is available on GitHub , and below is an example of the code in use.

The rest of the site (theme included) is a work in progress, don't pay attention to my shitty padding and buttons :tongue:

That could be neat if you were developing some form of window manager. Windows being effectively slabs.

This is interesting...I'd like to see a website totally designed in this style to see how it comes out. If it embraces it in the correct way it could probably look pretty good

I would also be curious to see how this could develop. I used to hate minimalist styles since win8 came out.. but people are getting much more innovative with simpler designs imo.