Learn New Design Skills

Refactoring HTML and CSS

Refactoring is the process of rewriting and restructuring the code to improve the design of the code base. Here's how to improve your web projects by refactoring your code.

Animating HTML Links with CSS Transition

The CSS transition property does what it sounds like; it creates transitions! But more specifically, it controls the animation speed when changing a CSS style from one state to another.

How to create animations using only CSS and @keyframes

The animation property and the @keyframes rule can be used to add animation effects using only CSS!

How to Use Different CSS Color Values (RGB, Keywords, HSL)

One of the properties that are used quite often in CSS is color. It can be used with many different types of values such as RGB, HSL and keywords.

Intro to HTML and CSS

In this intro to HTML and CSS, we provide a basic overview of the web development landscape and common terminology used in HTML and CSS.

How to Add a CSS Gradient Overlay to a Background Image

This article was originally posted at https://medium.com/@christinatruong/how-to-add-a-css-gradient-overlay-to-a-background-image-170216435f65 and was kindly shared by Christina Truong. Check out more of her work at https://christinatruong.com. Using images on a web page helps to…

6 Best JavaScript Frameworks to Use In 2021

JavaScript (JS) is a dynamic web programming language that can update and alter both CSS and HTML. It conforms to the ECMAScript specifications and is used to manipulate, validate, and…

Video Tutorial: How To Create A Responsive Image Slider

It’s been a while since we posted anything on our YouTube channel, but starting today we are back on YouTube! In this collaboration with Jack Herrington, Jack will teach you…

Create a Carousel using CSS Scroll Snap and JavaScript

This tutorial will help you create a responsive carousel using the CSS scroll-snap property and very little JavaScript for navigation. You can use it for products display, or as a…

How To Create a Responsive Timeline with Image Thumbnails

In this tutorial you will learn how to create a responsive timeline for a set of related events you wish to display in a chronological (or reverse chronological) sequence. This…

Learn How to Create Flip Cards using CSS

In this tutorial you will learn how to create blog post cards that flip on hover revealing the post excerpt on the back of the card. We will achieve this…

Create Simple Parallax Scrolling Effect in Hero Section using Pure CSS

In this tutorial you will learn how to create a simple pure CSS parallax scrolling effect in the hero section of your landing page. Parallax scrolling is an effect where…

Category: Learn