Learn Responsive Design

Learn how to create responsive designs that adapt to different screen sizes and devices, providing a seamless user experience across all platforms.
  1. How to Build a Responsive Navigation Bar With Flexbox

    How to Build a Responsive Navigation Bar With Flexbox

    Tutorial Intermediate

    Time for a practical exercise in flexbox! In this tutorial we will use flexbox to create a mobile-first, responsive, toggleable navigation bar with different...

  2. Top 20+ Responsive Shopify Themes for 2024

    Top 20+ Responsive Shopify Themes for 2024

    Tutorial Beginner

    Looking for the best Shopify templates? Here we'll review the best responsive theme Shopify options for 2024.

  3. 31 Best Shopify Themes With Responsive (Mobile-Ready) Designs for 2024

    31 Best Shopify Themes With Responsive (Mobile-Ready) Designs for 2024

    Tutorial Beginner

    If you're building an online store, these responsive Shopify themes will get you started right in eCommerce. Discover some of the best Shopify themes for...

  4. 31+ Best Responsive WordPress Themes (For Sites in 2024)

    31+ Best Responsive WordPress Themes (For Sites in 2024)

    Tutorial Beginner

    It almost goes without saying these days, but you need a responsive website for 2024. Here, we’ll show you some of the best WordPress themes with flawless...

  5. Web Design for Beginners

    Web Design for Beginners

    Course Beginner

    If you’re new to web design, this free course on web design for beginners will teach you everything you need to know.

  6. How to Use HTML5 “picture”, “srcset”, and “sizes” for Responsive Images

    How to Use HTML5 “picture”, “srcset”, and “sizes” for Responsive Images

    Tutorial Beginner

    In this tutorial we’ll see what the srcset and sizes attributes can do, how to use them with an img or picture element, and how to know which combination is...

  7. Building a Horizontal Timeline With CSS and JavaScript

    Building a Horizontal Timeline With CSS and JavaScript

    Tutorial Intermediate

    In this tutorial, we’ll learn how to build a responsive horizontal timeline from scratch. First, we’ll create the basic structure with minimal markup and the...

  8. How to Use Figma for Responsive Web Design

    How to Use Figma for Responsive Web Design

    Tutorial Beginner

    A responsive website must consider a range of screens and devices. In this tutorial we'll look at some tips and tricks to create a responsive design in Figma. 

  9. How to Build a Stylish, Responsive HTML Table

    How to Build a Stylish, Responsive HTML Table

    Tutorial Beginner

    In this tutorial, we'll learn how to build a stylish table and modify its layout to adapt to various screen sizes. The data presented in our table will come...

  10. 15+ Best Mobile UI Kits for Android

    15+ Best Mobile UI Kits for Android

    Tutorial Beginner

    Have you ever designed a new mobile app? It could be a complicated and time-consuming task. To relieve you of some of that workload we have selected some of...

  11. 4 Quick Steps to Make a Website Responsive

    4 Quick Steps to Make a Website Responsive

    Tutorial Beginner

    This article will be a guide to building responsive web pages - we'll explore some methods for ensuring your web page looks good across all screens.

  12. How to Create Fluid Typographic Scales for Your Responsive Website

    How to Create Fluid Typographic Scales for Your Responsive Website

    Tutorial Beginner

    In this video you’ll learn how to define the typography sizing for your responsive website using fluid typographic scales.