20 Examples of Centered Website Designs
Centering elements in a web design is a very effective way of creating visual balance. Centered designs can also make responsiveness easier, a property that is becom
Archive
Here you can browse through all posts from the categories articles, tutorials and playground.
Hover and Click Trigger for Circular Elements with jQuery
Today we want to share one possible solution to the circle hovering problem. We'll create a plugin that will take care of the 'mouseenter', 'mouseleave' and 'click'
Elastic Image Slideshow with Thumbnail Preview
Today we want to show you how to create a simple elastic slideshow with a thumbnail preview. The slideshow will adjust automatically to its surrounding container and
Fullscreen Image Blur Effect with HTML5
In Playground by Mary Lou on
Today we want to share a neat image blur effect with you. Using canvas, we want to blur images on the transition to another one, creating a smooth effect.
Communication, Mood and Meaning: Lines in Web Design
In Articles by Patrick Cox on
Lines, lines, lines. Lines are everywhere in design, they are used to divide space, direct the user's eye, create flow, create emphasis and organize all design eleme
25 Fresh Examples of Beautiful Typeface Combinations in Web Design
In Articles by Gisele Muller on
Typography is a very important part of design and choosing the right type for your design can be very challenging. From print to web layouts, typography is the cente
Interactive Typography Effects with HTML5
In Tutorials by Tim Holman on
With HTML5 gaining popularity, this tutorial outlines what is really just the tip of the iceberg that is interactive design. In this tutorial I will go over the dev
Animated Buttons with CSS3
Still hyped by the possibilities of CSS3, I want to share some CSS3 button experiments with you. The idea is to create some animated link elements with different sty
25 Inspiring Examples of Texture Use in Minimal Web Design
In Articles by Gisele Muller on
Today we decided to gather a few examples of minimal sites using texture to add detail to their layout. From really subtle and delicate examples to complete textured
Original Hover Effects with CSS3
In Tutorials by Alessio Atzeni on
The power of CSS3 is enormous and in this tutorial we will see how to exploit it in a very creative way. We are going to create some thumbnail hover effects with CSS
Fullscreen Image 3D Effect with CSS3 and jQuery
In Playground by Pedro Botelho on
Today we want to share one of our CSS 3D Transforms experiments with you. The idea is to show an image's fullscreen version by rotating two blocks in three-dimension
Be More Creative through Design Constraints
In Articles by Patrick Cox on
For a lot of designers constraints are kryptonite or a barbed wire fence that is a prison for their design freedom. But design constraints shouldn’t be viewed as p
Creative CSS3 Animation Menus
Being in the mood for experimenting with CSS3, I'd like to show you some creative menu hover effects in today's tutorial. The idea is to have a simple composition of
Developing Unity in Web Design
In Articles by Patrick Cox on
In the previous "Developing {blank} in Web Design" articles I've discussed Rhythm, Balance and Emphasis. But we are missing the last main principle of design — Uni
Blur Menu with CSS3 Transitions
There are so many great things we can do with the additional properties and possibilities that CSS3 brings along. Today I want to show you how to experiment with tex
Wave Display Effect with jQuery
In Playground by Mary Lou on
How cool is it to sometimes just display content a little bit differently? Today we want to share an experiment with you that let's you show images and content in a
Architecture in Web Design: Applying Vitruvius’ Principles
In Articles by Patrick Cox on
Let's make a real world comparison: buildings are very much like web sites. So are we (web designers and developers) essentially just architects? When you compare we
Flexible Slide-to-top Accordion
In today's tutorial we'll be creating a simple responsive accordion that, when opened, will slide to the top of the viewport and reveal the content by fading it in.