css3 Archive

This is s responsive, magazine-like website layout with a grid item animation effect that happens when opening the content.It’s been developed by Codrops. The responsive layout has a sidebar and grid items that animate to a larger content area when clicked. In …

Boxify is a stylish HTML5/CSS3 template that was carefully crafted and enhanced with some smooth effects. It’s fitting for any type of portfolio or start-up website, but it’s very flexible and can be used for many other projects.This free website template has …

Auto-hide sticky header makes site navigation easily accessible anywhere on the page and saves content space at the same. Auto-hide means hiding the header automatically when a user starts scrolling down the page and bringing the header back when a user might …

This is a slide-in filter panel powered by CSS and jQuery and created by Codyhouse.It is actually an essential feature if your website has lots of content, distributed across different categories. For an e-commerce, it is a way to increase conversion rates …

This is a tutorial of effects on text inputs using CSS transitions, animations and pseudo-elements.Form inputs offer a great opportunity to add some subtle and interesting effects to a web page. They are elements that your user will interact with at some …

Another great tutorial from Codyhouse.A list of split blocks that reunite on scrolling, simulating a movement along the z-axis with the help of CSS transformations and jQuery. The 2-blocks design approach is quite common nowadays. On one side the text paragraph, on …

”Expandable Project Presentation with CSS3 & jQuery” is a gallery of project preview images that expand on click to reveal the full case study by Claudia Romano – Codyhouse. The real power of CSS Transitions is in allowing a smooth passage from …

A three dimensional and space efficient menu. Meny works best in browsers with support for CSS 3D transforms, although it falls back on 2D animation for older browsers. Supports touch events for mobile devices. Move your mouse towards the arrow — or …

This is a great 3D Rotating Navigation tutorial by Codyhouse.(Claudia Romano).It is powered by CSS transformations.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 …

There are some patterns in the e-commerce design world aimed at increasing the conversion rate by simplifying the user experience. Other patterns try to achieve the same goal by providing additional information where needed. The product quick view modal belongs to the …

We have published a few posts about experimental CSS3 and HTML5 to show the power of them.And you know,new projects are being released so often and personally i like to check out these new experiments.This time we are showcasing (mostly fresh) projects …