CSS gradient patterns

Using the CSS3 background gradient property it is possible to make many repeatable patterns like strips or arrows. Lea Verou has created a wonderful pattern library for these. I wanted to go a bit more in depth on this subject and add a few of my own patterns too. I’ll be going through the use of the various background properties involved in creating these patterns along with some examples. (more…)

Image hover descriptions

In the last few days I have been playing around with CSS3 transforms and transitions for use in an image gallery I’m been working on. I came up with a cool way to keep the gallery looking clean and minimal, while giving the user some extra into about the image when they hover. This effect has been done plenty of times before but often obscures the image while the description is shown, which I feel defeats the purpose of an image gallery, the image should be the main focus after all. (more…)

Fixed headers

You may have noticed that there is a trend for fixed headers going around the internet. It’s generally a good thing too, having the navigation always accessible is certainly beneficial for the user experience along with always having the logo visible. There are times though when the screen real estate is more important, in fact this is important pretty much all the time, specially on mobile devices. There are a couple of different solutions to this problem but one of the best is the shrinking header.
(more…)