Your logo is the most important piece of your overall branding and is usually the first statement a website visitor will most likely identify with. In this tutorial we will teach you how to add a vector logo to your website using CSS3 and a Scalable Vector Graphic (SVG).

The best practice in our opinion for usability is to keep your navigation visible for as long as possible before resorting to hiding it. In part 2 of this two-part tutorial we will teach you how to show and hide your newly designed pure CSS hamburger button and navigation using Media Queries and jQuery for your responsive website.

One of the most important aspects of responsive web design is the navigation, it typically needs to be hidden and accessed via a button. In Part 1 of this two-part tutorial we will teach you how to create an animated hamburger button with CSS and jQuery for your responsive website.

On mobile devices a very common occurrence is when text strings are too long to fit inside the container element thus overflowing it. In this tutorial we will teach you how to easily break overflowing text strings responsively using the CSS word-break property.

You may have seen major websites with truncated text in the sidebar in order to keep things tight and neatly organized. In this tutorial we will teach you how to easily truncate text strings responsively while adding ellipsis at the end via CSS.

Back in 2010 we wrote a tutorial on how to create a digital 8-bit style effect for corners using only CSS. Now it’s 2017 and we’ve decided to revisit our earlier method and improve upon it. In this tutorial we will teach you an updated method for coding beautiful responsive digital 8-bit style corners using only 100% CSS3 requiring zero images and less markup.

A very common and stylistic trend in web design is to overlay text over top an image. We do this quite often and have developed several different methods for achieving this type of layout. In this tutorial we will teach you how to center position text over an image with a color overlay using pure CSS3.

In part 1 of our preloader tutorial we taught you how to create a pure CSS3 preloader without images that utilizes CSS3 animations. In this tutorial we will teach you how to remove your CSS3 preloader on page load using jQuery.

If you are building a website and are worried about load times, preloaders are a great way to reduce user frustration due to varying load times. In part 1 of this tutorial we will teach you how to create a pure CSS3 preloader without images that utilizes CSS3 animations.