Freecode Academy

Applied Visual Design

↴ Applied Visual Design

Create Visual Balance Using the text-align Property

Adjust the Width of an Element Using the width Property

Adjust the Height of an Element Using the height Property

Use the strong Tag to Make Text Bold

Use the u Tag to Underline Text

Use the em Tag to Italicize Text

Use the s Tag to Strikethrough Text

Create a Horizontal Line Using the hr Element

Adjust the background-color Property of Text

Adjust the Size of a Header Versus a Paragraph Tag

Add a box-shadow to a Card-like Element

Decrease the Opacity of an Element

Use the text-transform Property to Make Text Uppercase

Set the font-size for Multiple Heading Elements

Set the font-weight for Multiple Heading Elements

Set the font-size of Paragraph Text

Set the line-height of Paragraphs

Adjust the Hover State of an Anchor Tag

Change an Element's Relative Position

Move a Relatively Positioned Element with CSS Offsets

Lock an Element to its Parent with Absolute Positioning

Lock an Element to the Browser Window with Fixed Positioning

Push Elements Left or Right with the float Property

Change the Position of Overlapping Elements with the z-index Property

Center an Element Horizontally Using the margin Property

Learn about Complementary Colors

Learn about Tertiary Colors

Adjust the Color of Various Elements to Complementary Colors

Adjust the Hue of a Color

Adjust the Tone of a Color

Create a Gradual CSS Linear Gradient

Use a CSS Linear Gradient to Create a Striped Element

Create Texture by Adding a Subtle Pattern as a Background Image

Use the CSS Transform scale Property to Change the Size of an Element

Use the CSS Transform scale Property to Scale an Element on Hover

Use the CSS Transform Property skewX to Skew an Element Along the X-Axis

Use the CSS Transform Property skewY to Skew an Element Along the Y-Axis

Create a Graphic Using CSS

Create a More Complex Shape Using CSS and HTML

Learn How the CSS @keyframes and animation Properties Work

Use CSS Animation to Change the Hover State of a Button

Modify Fill Mode of an Animation

Create Movement Using CSS Animation

Create Visual Direction by Fading an Element from Left to Right

Animate Elements Continually Using an Infinite Animation Count

Make a CSS Heartbeat using an Infinite Animation Count

Animate Elements at Variable Rates

Animate Multiple Elements at Variable Rates

Change Animation Timing with Keywords

Learn How Bezier Curves Work

Use a Bezier Curve to Move a Graphic

Make Motion More Natural Using a Bezier Curve