Learn how to customize and configure Tailwind CSS themes, colors, and spacing. A step-by-step guide for beginners to tailor Tailwind to their project needs.

How to Customize and Configure Tailwind CSS: A Beginner Guide

Learn about Tailwind CSS utility classes, their importance, and usage through a real-world example. 

What are the Utility Classes in Tailwind CSS?

Learn how to use Tailwind CSS to create attractive website animations.

Mastering Tailwind Animations for Beginners

How to Convert CSS to SCSS

One of the best ways to start coding is by building websites. Whether you want to tweak your business’s site, hone your web development skills, or learn to collaborate with developers, this Skill Path will help you get there. Learn important HTML and CSS fundamentals and practice your new skills with real-world projects.

Learn the basics of web development to build your own website.

Build a Website with HTML, CSS, and GitHub Pages

Front-end engineers work closely with designers to make websites beautiful, functional, and fast. This Career Path will teach you the technologies you need to do just that.

Front-end engineers work closely with designers to make websites beautiful, functional, and fast.

Front-End Engineer

### About this course
Learn how to create interactive, responsive websites quickly using Bootstrap 4. This framework simplifies layout creation and site design, enabling you to focus on functionality rather than writing extensive CSS from scratch.

### Skills you'll gain
* Build layouts with Bootstrap's grid system
* Style sites using utility classes and components
* Create responsive websites with HTML, CSS, and JavaScript
* Accelerate development with Bootstrap's predefined tools

Give your website a clear layout and polished style—fast! Learn how to use one of the most popular front-end frameworks, Bootstrap 4!



Learn Bootstrap

### About this course
Sass is a powerful CSS preprocessor that makes styling more efficient and maintainable. By reducing repetitive code and offering features like variables and mixins, Sass helps you write scalable and reusable styles quickly. This course will teach you to transition from CSS to SCSS and streamline your workflow for small and large projects.

### Skills you'll gain
* Use Sass features like variables, mixins, and functions
* Apply nesting and placeholders to simplify styles
* Transition from CSS to SCSS for better maintainability

Expand your CSS knowledge by learning SCSS syntax, nesting, functions, and more in this course!

Learn Sass

### About this course
You’ll find learning CSS essential in styling websites. Web developers use it to build on basic HTML and add personality to plain text pages. This course helps you expand your coding foundation and gives you CSS interactive practice to start adding colors and background images or editing layouts so you can create your very own, unique stylized web pages. 

### Skills you'll gain
* Add styling to HTML elements
* Connect HTML and CSS files
* Create unique web page layouts

In this CSS tutorial, you’ll learn how to add CSS to visually transform HTML into eye-catching sites.

Learn CSS

### About this course
This course teaches you how to use color effectively in web design. It's perfect for marketers, designers, and developers who want to enhance the visual appeal and functionality of their websites and apps. You'll explore color theory, user experience, brand colors, and accessibility to create designs that engage and convert.

### Skills you'll gain
* Use primary and secondary colors
* Apply brand and UI interaction colors
* Understand color psychology and accessibility
* Implement design principles with CSS

Learn how to use color effectively to create attractive and useable websites!

Learn Color Design

### About this course
Learn the building blocks of web design with HTML and CSS. This course will teach you to create and style websites from scratch. Using Bootstrap, you’ll quickly develop responsive, attractive web pages. Whether you're building a portfolio or a personal project, this course equips you with the skills to bring your web design ideas to life.

### Skills you'll gain
* Build and structure websites with HTML5
* Style websites using CSS3
* Use Bootstrap for responsive web design
* Understand layout and page customization

Explore HTML & CSS fundamentals as you build a website in this introductory web development course.

How to Make a Website with NameCheap

### About this course
Deploying websites is a crucial skill for developers. This course teaches you how to publish content to the web, use Jekyll for quickly setting up static sites, and utilize GitHub Pages for hosting. You'll also learn how to manage custom domain names with AWS, ensuring a smooth deployment process.

### Skills you'll gain
* Deploy websites using Jekyll and GitHub Pages
* Host sites on GitHub and manage static content
* Purchase and assign a custom domain name with AWS

Learn how to publish a website to the Internet with Jekyll, Amazon Web Services (AWS), and GitHub Pages.

How to Deploy a Website

### About this course

Fun fact: all websites use HTML — even this one. It’s a fundamental part of every web developer's toolkit. HTML provides the content that gives web pages structure, by using elements and tags, you can add text, images, videos, forms, and more. Learning HTML basics is an important first step in your web development journey and an essential skill for front- and back-end developers. 

### Skills you'll gain
* Structure pages with HTML
* Present data with tables
* Write cleaner HTML  



Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.

Learn HTML

### About this course
Continue your CSS learning journey with Learn CSS: Responsive Design. As a website developer, it's your responsibility to ensure that your websites remain legible and visually appealing across a variety of devices. You can also increase the accessibility of your website by using responsive design techniques.

### Skills you'll gain
* Use relative sizing units
* Implement media queries
* Scale websites across devices

### Notes on Prerequisites
We recommend that you complete [Learn CSS: Transitions](https://www.codecademy.com/learn/learn-css-transitions) before completing this course.

Create websites viewable on devices of all sizes using responsive design techniques, such as relative sizing units and media queries.


Learn CSS: Responsive Design

### About this course
This course focuses on the essential principles of navigation design for websites. You'll learn to create user-friendly navigation systems using links, buttons, and breadcrumbs, ensuring your users can quickly find the information they need. By mastering these skills, you will enhance the overall usability and experience of your websites.

### Skills you'll gain
* Designing navigation with links, buttons, and breadcrumbs
* Building intuitive website structures
* Enhancing user experience and accessibility with effective navigation systems

Learn how to build and structure websites that are easy for users to navigate.

Learn Navigation Design

### About this course
A-Frame is a web framework for creating virtual reality experiences directly in the browser using simple HTML. This course introduces you to foundational A-Frame concepts like HTML primitives, building virtual environments, and designing user interactions. Explore VR by building engaging projects on a computer or in a VR headset.

### Skills you'll gain
* Build virtual reality experiences with A-Frame
* Create virtual environments and interactions
* Use HTML primitives for VR design
* Develop VR projects like the Flower of Life and Solar System

Ready to learn VR in VR? Dive into A-Frame and learn how to build virtual reality experiences in the browser.

Learn A-Frame (VR)

### About this course
Take your CSS skills to the next level! This course teaches you how to add dynamism and visual effects to your web pages, helping you recreate the polish of professional websites. You'll gain the skills to build flexible layouts, elegant transitions, and accessible designs that adapt to varying devices and user needs.

### Skills you'll gain
* Implementing smooth transitions
* Designing flexible layouts
* Creating responsive designs
* Enhancing web accessibility

Learn how to implement elegant transitions, create new layouts and serve users with dynamic needs.

Learn Intermediate CSS

### About this course
Enhance your web development skills with CSS-in-JS, a modern technique that integrates CSS styling within JavaScript. Many tech companies use CSS-in-JS libraries, making it a valuable skill to boost your job prospects.

### Skills you'll gain
* Understand the difference between CSS-in-JS and traditional CSS
* Use the [Emotion](https://emotion.sh/) library to style React components
* Apply CSS-in-JS for efficient styling in JavaScript

Advance your CSS styling strategies with CSS-in-JS, a popular technique that allows programmers to write CSS styling in JavaScript.

Learn CSS-in-JS

### About this course 
Continue your CSS learning journey with Learn CSS: Box Model and Layout. Make websites look exactly like you want them by gaining an understanding of how to fine-tune the display and positioning of HTML elements.

### Skills you'll gain
* Explain the box model
* Position HTML elements
* Change the layout of elements

### Notes on Prerequisites
We recommend that you complete [Learn CSS: Introduction](https://www.codecademy.com/learn/learn-css-introduction) before completing this course.

Use the box model to fine tune display and positioning of HTML elements.

Learn CSS: Box Model and Layout

### About this course
Ready to start your journey into Cascading Style Sheets (CSS)? Take Learn CSS: Introduction — with CSS, you can add color, background images, and change around layouts to make your web pages feel like works of art!

### Skills you'll gain
* Style websites with CSS
* Write and use CSS selectors
* Change the look of HTML elements

Learn how to use CSS (Cascading Style Sheets) to style and visually organize HTML pages.

Learn CSS: Introduction 

### About this course
Continue your CSS learning journey with Learn CSS: Colors. Create visually stunning websites by styling HTML elements using different color formats such as: named colors, hexadecimal, RGB, and HSL colors. 

### Skills you'll gain
* Choose and set CSS colors
* Differentiate color formats

### Notes on Prerequisites
We recommend that you complete [Learn CSS: Box Model and Layout](https://www.codecademy.com/learn/learn-css-box-model-and-layout) before completing this course.

Level up your design skills by learning different ways to set CSS colors and formats.

Learn CSS: Colors

### About this course
Continue your CSS learning journey with Learn CSS: Responsive Design. As a website developer, it's your responsibility to ensure that your websites remain legible and visually appealing across a variety of devices. You can also increase the accessibility of your website by using responsive design techniques.

### Skills you'll gain
* Use relative sizing units
* Implement media queries
* Scale websites across devices

### Notes on Prerequisites
We recommend that you complete [Learn CSS: Transitions](https://www.codecademy.com/learn/learn-css-transitions) before completing this course.


Create websites viewable on devices of all sizes using responsive design techniques, such as relative sizing units and media queries.

Learn CSS: Variables and Functions

### About this course
Continue your CSS learning journey with Learn CSS: Typography and Fonts. Learning about typography will allow you to draw your users' attention to important text, create a visual flow on your web page, and quickly make your web page look much more attractive!

### Skills you'll gain
* Style and transform text 
* Import fonts from other sites

### Notes on Prerequisites
We recommend that you complete [Learn CSS: Colors](https://www.codecademy.com/learn/learn-css-colors) before completing this course.


Use CSS typography to style your text and include fonts from other sources.

Learn CSS: Typography and Fonts

### About this course
Continue your CSS learning journey with Learn CSS: Transitions and Animations. Add dynamic interactivity to your websites by with CSS transitions by animating your web elements to be able to shake, slide, and grow. 

### Skills you'll gain
* Animate elements on a page
* Customize CSS animations
* Set transition specifications
 
### Notes on Prerequisites
We recommend that you complete [Learn CSS: Flexbox and Grid](https://www.codecademy.com/learn/learn-css-flexbox-and-grid) before completing this course.


Learn how to make your website shake, slide, and grow with CSS transitions.

Learn CSS: Transitions and Animations

### About this course
Continue your CSS learning journey with Learn CSS: Browser Compatibility. If you’ve ever visited a website and noticed that it loaded differently in Chrome versus Firefox, this is because each browser renders a website slightly differently. Ensure consistent user experience by learning how to address browser compatibility issues. 

### Skills you'll gain
* Describe browser compatibility 
* Explain compatibility needs
* Create consistent experiences

### Notes on Prerequisites
We recommend that you complete [Learn CSS: Accessibility](https://www.codecademy.com/learn/learn-css-accessibility) before completing this course.

Ensure consistent user experience regardless of the browser by addressing browser compatibility issues.

Learn CSS: Browser Compatibility

### About this course
Continue your CSS learning journey with Learn CSS: Flexbox and Grid. Create elegant and flexible web page layouts with CSS flexbox and two-dimensional layouts using CSS grid. 

### Skills you'll gain
* Create flexible page layouts
* Set up two-dimensional layouts

### Notes on Prerequisites
We recommend that you complete [Learn CSS: Box Model and Layout](https://www.codecademy.com/learn/learn-css-box-model-and-layout) before completing this course.

Create elegant and flexible web page layouts with CSS flexbox and grid.


Learn CSS: Flexbox and Grid

### About this course
Ready to start your journey into the HTML programming language? Take Learn HTML: Fundamentals. All websites use HTML—it's a fundamental part of every web developer's toolkit. HTML is used to provide the content that structure web pages.

### Skills you’ll gain
* Recognize how HTML is used to create the structure and content of a web page.
* Describe the anatomy of HTML elements.
* Create web pages with text, images, videos, and links.

Build an important foundation for creating the structure and content for web pages.

Learn HTML: Fundamentals

### About this course
Continue your HTML learning journey with Learn HTML: Tables. You'll learn how to present data in an organized manner with HTML tables.

### Skills you'll gain
* Identify various components of an HTML table.
* Create tables with the desired number of rows and columns.
* Format tables using attributes and basic CSS.

### Notes on prerequisites
We recommend that you complete [Learn HTML: Fundamentals](https://www.codecademy.com/learn/learn-html-fundamentals) before starting this course.

Learn how to create HTML tables to present data in an organized manner and format your tables with CSS.

Learn HTML: Tables

### About this course
Continue your HTML learning journey with Learn HTML: Forms. Using forms, you can collect user data. Learn about the inner workings of an HTML form, create forms with various input fields, and validate user data.

### Skills you’ll gain
* Recognize how forms are used to collect user data.
* Create HTML forms that collect various types of user input.
* Validate user input by adding attributes to inputs.

### Notes on prerequisites
We recommend that you complete [Learn HTML: Tables](https://www.codecademy.com/learn/learn-html-tables) before starting this course.

Learn how to create HTML forms with various input fields to collect and validate user data.

Learn HTML: Forms

### About this course
Continue your HTML learning journey with Learn HTML: Semantic HTML. Semantic HTML is a modern standard that makes a website accessible, improves your website's SEO, and increases code readability.

### Skills you’ll gain
* Recognize the benefits of using Semantic HTML.
* Structure web pages using appropriate Semantic HTML elements.
* Create HTML elements that provide additional information.

### Notes on prerequisites
We recommend that you complete [Learn HTML: Forms](https://www.codecademy.com/learn/learn-html-forms) before starting this course.

Learn how to use Semantic HTML to create cleaner, more accessible web pages.

Learn HTML: Semantic HTML

### About this course
Ready to start your journey into the Sass scripting language? Take Learn Sass: Fundamentals—Sass is an easy-to-use styling language that helps reduce a lot of the repetition and maintainability challenges of traditional CSS. Learning Sass will not only let you create scalable styling when working on big web development projects, it will also be faster and more efficient to write reusable styles from scratch for smaller projects.

### Skills you’ll gain
* Write fundamental Sass syntax.
* Compile Sass into regular CSS.
* Explain the need for Sass.

### Notes on prerequisites
We recommend that you complete [Learn CSS: Typography and Fonts](https://www.codecademy.com/learn/learn-css-typography-and-fonts) before starting this course.

Expand your CSS knowledge and style your sites even faster by learning Sass.

Learn Sass: Fundamentals

### About this course
Continue your Sass learning journey with Learn Sass: Mixins and the Parent Selector. You'll learn how to create mixins which accept arguments to provide more flexibility to your rules. You will also use the parent selector (`&`) to expand upon base stylings.

### Skills you’ll gain
* Create mixins to incorporate arguments into styling.
* Use the parent selector (`&`) to extend styling.
* Dynamically construct file names using string interpolation.


### Notes on prerequisites
We recommend that you complete [Learn Sass: Fundamentals](https://www.codecademy.com/learn/learn-sass-fundamentals) before starting this course.


Use mixins to add more flexibility to your styles and expand stylings with the & selector.

Learn Sass: Mixins and Parent Selector

### About this course
Continue your Sass learning journey with Learn Sass: Functions and Operations. You'll learn how to use Sass functions, operators, loops, and conditionals to style elements even faster.

### Skills you’ll gain
* Use Sass functions to expand styling outcomes.
* Iterate over elements using loops.
* Add logic to styling rules using conditionals.


### Notes on prerequisites
We recommend that you complete [Learn Sass: Mixins and the Parent Selector](https://www.codecademy.com/learn/learn-sass-mixins-and-the-parent-selector) before starting this course.

Learn how to incorporate functions, loops, operators, and conditionals in Sass.

Learn Sass: Functions and Operations

### About this course
Continue your Sass learning journey with Learn Sass: Best Practices. You'll learn how to use import files, organize file structures, and Sass shorthand to keep your code DRY and scalable.

### Skills you’ll gain
* Set up coherent file structure practices.
* Import stylings from other sheets.
* Keep your code DRY with best practices.



### Notes on prerequisites
We recommend that you complete [Learn Sass: Functions and Operations](https://www.codecademy.com/learn/learn-sass-functions-and-operations) before starting this course.

Learn best practices for setting up file structure, importing stylings, and writing scalable Sass.

Learn Sass: Best Practices

HTML is the foundation of all web pages. It defines the structure of a page, while CSS defines its style. HTML and CSS are the beginning of everything you need to know to make your first web page! Learn both and start creating amazing websites.

Best HTML + CSS Courses & Tutorials

Create various themes and reactive elements for a bird-watching website using CSS variables and functions.


Curious Ornithologist

Update a blog to meet common CSS accessibility standards.

Code! Blog

Utilize the Django framework to create an app that helps track a restaurant's inventory and sales. 

Django Delights

Create an inspirational homepage where you can check the weather, read an inspirational quote, view a pretty image, and write down your goals for the day.

HTML & CSS courses

About HTML & CSS

Related topics

HTML & CSS courses

Level

Price

Type

Average time to complete

Related resources

Related projects

Curious Ornithologist

Code! Blog

Django Delights

Inspirational Homepage

Related articles

How to Customize and Configure Tailwind CSS: A Beginner Guide

What are the Utility Classes in Tailwind CSS?

Mastering Tailwind Animations for Beginners

How to Convert CSS to SCSS

Resources

Support

Resources

Support

Plans

Community

Subjects

Languages

Career building

Mobile

Mobile

Related articles

Article
How to Customize and Configure Tailwind CSS: A Beginner Guide
Learn how to customize and configure Tailwind CSS themes, colors, and spacing. A step-by-step guide for beginners to tailor Tailwind to their project needs.

Article
What are the Utility Classes in Tailwind CSS?
Learn about Tailwind CSS utility classes, their importance, and usage through a real-world example.

Article
Mastering Tailwind Animations for Beginners
Learn how to use Tailwind CSS to create attractive website animations.

Article
How to Convert CSS to SCSS
Guide on converting CSS to SCSS syntax.