Posts Categorized / Tutorials


Zoom slider on mockup devices

A tutorial about creating a zoom slider on mockup devices (iPhone, iPad, MacBook, iMac and Apple Watch) by Codrops. get it here


CSS mega dropdown menu

A responsive and easy to customise mega-dropdown component that you may find useful when building a menu for your website or theme. get it here


Product Preview Slider

An easy way to show more product images and variations right in the product gallery. While you scroll through pages of products, you often base your decision to “know more” about a product on pictures only. Visual impact, in particular on mobile devices, is essential to everyone’s buying process. What if a product is available […]


Secondary sliding navigation

A bold, secondary menu that slides over the main navigation. Today’s resource is a simple, handy snippet: a secondary navigation that slides down, replacing the main navigation links. This approach can be an alternative to a standard dropdown menu, in particular if you want to emphasise more the sub navigation. Besides you can easily customize […]



A mobile-friendly pagination component, that can be easily customized using CSS or Sass. Pagination links simply allow users to surf through your content. A valid alternative is infinite scrolling, although it has strengths and weaknesses to be aware of. get it here


Content filter with CSS & jQuery

An awesome tutorial explaining how to create a slide-in filter panel powered by CSS and jQuery. Created by CodyHouse. get it here


3D Rotating Navigation

Sometimes you just want your website navigation to be bold. Design agencies, for example, use their portfolio to show off their skills and push a little usability standards. Another good example is mobile apps: animated elements are key ingredients of the user experience. In this case a 3D menu can’t just be fun. It has […]


Simple responsive pricing tables

Simple responsive pricing tables, in 3 different styles and with a bouncy animation while switching to different plans. get it here


Flexbox Cheatsheet Cheatsheet

The defining aspect of the flex layout is the ability to alter its items’ width and/or height to best fill the available space on any display device. A flex container expands items to fill available free space, or shrinks them to prevent overflow. The flexbox layout algorithm is direction-agnostic as opposed to the block layout, […]