Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Applied Visual Design

This playlist contains 53 interactive scrims.

Applied Visual Design

53 lessons 58 min

1. Using the text-align Property
0:52
2. Adjust the Width of an Element Using the width Property
0:39
3. Adjust the Height of an Element Using the height Property
0:23
4. Use the strong Tag to Make Text Bold
0:39
5. Use the u Tag to Underline Text
0:35
6. Use the em Tag to Italicize Text
0:36
7. Use the em Tag to Italicize Text
0:34
8. Use the del Tag to Strikethrough Text
0:42
9. Create a Horizontal Line Using the hr Element
0:32
10. Adjust the background-color Property of Text
1:35
11. Adjust the Size of a Header Versus a Paragraph Tag
0:31
12. Add a box-shadow to a Card-like Element
1:38
13. Decrease the Opacity of an Element
0:46
14. Use the text-transform Property to Make Text Uppercase
0:37
15. Set the line-height of Paragraphs
0:26
16. Set the font-size of Paragraph Text
0:21
17. Set the font-weight for Multiple Heading Elements
0:58
18. Set the font-size for Multiple Heading Elements
1:21
19. Adjust the Hover State of an Anchor Tag
1:07
20. Change an Element's Relative Position
1:46
21. Move a Relatively Positioned Element with CSS Offsets
0:48
22. Lock an Element to its Parent with Absolute Positioning
1:41
23. Lock an Element to the Browser Window with Fixed Positioning
1:12
24. Push Elements Left or Right with the float Property
0:46
25. Change the Position of Overlapping Elements with the z-index Property
0:59
26. Center an Element Horizontally Using the margin Property
0:22
27. Learn about Complementary Colors
0:47
28. Learn about Tertiary Colors
2:23
29. Adjust the Color of Various Elements to Complementary Colors
1:17
30. Adjust the Hue of a Color
2:18
31. Adjust the Tone of a Color
0:57
32. Create a Gradual CSS Linear Gradient
2:16
33. Linear Gradient to Create a Striped Element
1:59
34. Create Texture by Adding a Subtle Pattern as a Background Image
0:50
35. Use the CSS Transform scale Property to Change the Size of an Element
0:43
36. Use the CSS Transform scale Property to Scale an HTML Element on Hover
0:52
37. Use the CSS Transform Property skewX to Skew an Element Along the X-Axis
0:51
38. Use the CSS Transform Property skewY to Skew an Element Along the Y-Axis
0:36
39. Create a Graphic Using CSS
1:03
40. Create a More Complex Shape Using CSS and HTML
2:30
41. Learn How the CSS @keyframes and animation Properties Work
2:10
42. Use CSS Animation to Change the Hover State of a Button
1:22
43. Modify Fill Mode of an Animation
0:53
44. Create Movement Using CSS Animation
1:23
45. Create Visual Direction by Fading an Element from Left to Right
0:26
46. Animate Elements Continually Using an Infinite Animation Count
0:42
47. Make a CSS Heartbeat using an Infinite Animation Count
0:38
48. Animate Elements at Variable Rates
0:33
49. Animate Multiple Elements at Variable Rates
0:45
50. Change Animation Timing with Keywords
1:06
51. Learn How Bezier Curves Work
2:33
52. Use a Bezier Curve to Move a Graphic
1:53
53. Make Motion More Natural Using a Bezier Curve
1:53