# Welcome to CSS

See what CSS can do and the projects you will build in this course, set up VS Code and your browser, write your first CSS rule, and look inside any web page with the developer tools.

Updated: November 10, 2026

## [Start Here](https://www.ask-codey.com/courses/css-in-depth/topics/css-start-here)

1. [What You Can Build with CSS](https://www.ask-codey.com/lessons/css-what-you-can-build) (Novice): CSS is what turns a plain page of words into a site people enjoy using, and this course takes you from your first rule to seven projects you can put online and show off.
2. [The Power of CSS](https://www.ask-codey.com/lessons/html-and-css-overview-the-power-of-css) (Novice): CSS Zen Garden shows one HTML page styled many completely different ways, proof of how much CSS alone can change.
3. [How This Course Works](https://www.ask-codey.com/lessons/css-how-this-course-works) (Novice): How CSS in Depth works on ask-codey.com, from reading a lesson and running its exercise checks to mastering a skill and passing a module assessment.

## [Your CSS Tools](https://www.ask-codey.com/courses/css-in-depth/topics/css-your-tools)

1. [Setup: VS Code, a Browser and Node.js](https://www.ask-codey.com/lessons/css-setup-your-tools) (Novice): Install VS Code with Live Server, a current browser and Node.js on Windows 11 or macOS, then open The Daily Grind's menu page and watch it reload every time you save.
2. [Your First CSS Rule](https://www.ask-codey.com/lessons/css-your-first-rule) (Novice): Write your first CSS rules on a coffee shop's menu, learn the name of every part (selector, declaration, property and value), and see what the browser does with a typo.
3. [Look Inside Any Page with Developer Tools](https://www.ask-codey.com/lessons/css-developer-tools) (Novice): Open the browser's developer tools on any page, find every CSS rule applied to an element, read what a crossed-out line means, and try a change live before you copy it into your stylesheet.

## [Exercise: First Styles](https://www.ask-codey.com/courses/css-in-depth/topics/exercise-css-first-styles)

1. [Exercise: First Styles](https://www.ask-codey.com/lessons/exercise-css-first-styles) (Novice): Give The Daily Grind's menu its look with five CSS rules from the owner's style guide, and run the exercise checks for the first time to see each rule pass.

Source: https://www.ask-codey.com/courses/css-in-depth/chapters/css-welcome-to-css
