Happy Birthday! 3 Years of Codrops
In Articles by Team Codrops on
Happy Birthday, Codrops! We are turning 3 today! We want to thank all of you and share some highlights of the past years.
Archive
Here you can browse through all posts from the categories articles, tutorials and playground.
We Are Architects
In Articles by Patrick Cox on
We all have a vision of what architects do, right? They sit in front of CAD all day drawing walls, doors and toilets on floor plans, right? But after realizing the d
Unfolding 3D Thumbnails Concept
In Playground by Mary Lou on
A 3D thumbnail view concept for image slideshows: the current image gets opened up and a thumbnail view unfolds in 3d.
Creative Background Styles and Trends in Web Design
In Articles by Carrie Cousins on
The right background style can really set the tone for your website. We'll explore some great examples and current trends in website backgrounds that include large i
Triple Panel Image Slider
A tutorial about how to create a triple panel jQuery image slider with a 3D look and swipe-like transitions.
Inject Energy Into Your Mobile Design with Light Effects
In Articles by Patrick Cox on
Light effects have been spicing up graphic designs for years. It's a great way to add interest, realism, abstractionism, or even energy to a bland experience. Used p
Circle Hover Effects with CSS Transitions
A tutorial about how to create different interesting hover effects on circles with CSS transitions and 3D rotations.
Freebie: Soft UI Kit (PSD)
In Freebies by Kim Petersen on
Today's freebie is the Soft UI Kit, a free PSD by Kim Petersen. Free for personal and commercial projects.
Animated Responsive Image Grid
In Playground by Mary Lou on
A jQuery plugin for creating a responsive image grid that will switch images using different animations and timings. This can work nicely as a background or decorati
Photo Booth Strips with Lightbox
A tutorial about how to create some neat scrollable photo booth strips and integrate Lightbox 2 and customize it in order to make it responsive and touch-device fr
Examples of Creative and Modern Effects in Web Design
From hover to scroll, there are many ways to surprise and engage website visitors. The possibilities are endless. Get inspired with these examples of creative and mo
Modern Block Quote Styles
Let's create some interesting and modern styles for block quotes. We'll be using different techniques for creating a unique look for six examples.
I Love Script Fonts (Here’s Why)
In Articles by Carrie Cousins on
Script fonts, when used in moderation, can add extra flair and an unexpected twist to design projects.
Designing the Dreaded Form: Getting Creative
In Articles by Patrick Cox on
In this follow-up article about designing forms we'll dig into how to actually become creative and apply some interesting design concepts to spice up your form.
3D Flipping Circle with CSS3 and jQuery
In this tutorial we will create a circle with a handle which will open once the little handle is clicked, creating a realistic 3D flipping effect with the help of CS
Old School Cassette Player with HTML5 Audio
In Playground by Mary Lou on
Vintage format meets modern web tech: an HTML5 audio player with realistic controls. Today we want to share an audio player with you that looks like an old school mu
Tips & Tools for Grid-based Layouts
In Articles by Carrie Cousins on
Developing a vertical (and responsive) grid can help maintain consistency in website design and ease the creation of responsive layouts.
Freebie: Baby Blue UI Kit (PSD)
In Freebies by Mike Donovan on
Today's freebie is the Baby Blue UI Kit, a free PSD by Michael Donovan. Free for personal and commercial projects.