Giveaway! Win Adobe Photoshop free for 1 year. Enter here for your change to win!
Downloaded 10,250 times
Today’s freebie is a sweet looking thumbnail overlay – the type of thing you might want to include to spice up a portfolio or photo gallery for example. Nice.
The design itself is pretty simple, essentially a coloured border coupled with a tinted overlay, nothing too extravagant but enough to be noticed. Have a play and let me know if you find a use for it!
All resources are offered free of charge with very little restriction. Want to show your support or some appreciation? Please check out my latest project Dunked. A simple tool for building an online portfolio.
Premium Pixels is a collection of free design resources created and curated by UK based Web Designer Orman Clark.
Hopefully you'll learn something new but hey, just saving yourself some time is awesome enough, right?
Read More...
10108423
Downloads and counting!
Awesome work mate! Thanks for sharing :)
Hey Orman, it would be nice to see a tutorial of how to do this using code.
Hi Kevin. The tutorial below should be useful, it basically explains how to make a div fade in after hovering over an image. You can style it to make it look like Orman’s with simple CSS!
http://web.enavu.com/tutorials/making-image-captions-using-jquery/
As Jack said, you could use that div fade in.
I feel this should be built using more fancy techniques. CSS3 Radius, dropshadows, and inset gradients should easily accomplish this.
Hey Kevin,
I completed the code necessary to transition this into a pure CSS3 concept! Only 3 images used (page background, and the two jpgs you are hovering).
You can view my example at http://iamunr.com/thumbnail-overlay/
And you can download the source at github, https://github.com/unr/thumbnail-hoverstate-overlay-html
Nice!
so damn clean, its perfect, thanks ;)
Great one. :-)
Hopin’ someone will create a HTML-one out of it. ;-)
There you go http://bit.ly/jpzPrT ;)
Awesome work João, turned out great!
Wow, thank you! :-)
Thank you Orman, i simply love to code your delicious freebies
Well Done Orman! I love it.
I just wanna ask; who made these Illustrations?
Thanks.
He shared in twitter, it was http://deedeekid.com/
Indeed, Niklas is a fantastic artist, love his work.
Beautiful!
Looks great Orman :) – It will come in handy.
I saw someone use this concept before. I can’t remember where, but this is still a nice idea to share with people. I love it. Especially how it actually emphasizes the “selected” feel.
These are lovely :) Thanks for sharing.
You are the bomb. Word.
Awesome! Thanks