Chapter 2: Shadow Play

15 tasks and 2 challenges

Let's take a look at the process of creating shadows using CSS. We will cover the box-shadow property bit by bit, learn how to use multiple shadows, and explore some advanced shadowing techniques.

1. The box-shadow Property Task

2. Horizontal Shadow Offset Task

3. Vertical Shadow Offset Task

4. Shadow Feathering Task

5. Stretching the Shadow Task

6. Feathering + Stretch Task

7. Shadow Color Task

8. Inner Shadow Task

9. Challenge: Dim Shadows Challenge

10. Semi-Transparent Shadow Task

11. Casting a Shadow Only from One Side Task

12. Multiple Shadows Task

13. Multiple Borders for One Element Task

14. Shadow Art – 1 Task

15. Shadow Art - 2 Task

16. Shadow Art - 3 Task

17. Challenge: The Foreboding Shadows Challenge