freeCodeCamp's Create a Gradual CSS Linear Gradient, Applied Visual Design

Channel:
United States We Will Code
Subscribers:
8,020
Published on ● Video Link: https://www.youtube.com/watch?v=5jJ21cAyWTU


Duration: 2:28
137 views
5

In this lesson from freeCodeCamp's Applied VIsual Design course we look at the linear gradient function. Linear gradient allows us to create a visual image which consists of ongoing transitions between multiple colors on a straight line. The result is of type object with a gradient data type (This is a unique type of image). We learn that linear gradient taks some parameters. The functions first argument helps specify the direction from which the color transition starts. We learn this argument is a degree, 90deg will make a vertical gradient and if we use a degree of 45 (45deg) it will be similar to a backslash angle.



Other Videos By We Will Code


2018-10-04freeCodeCamp's Modify Fill Mode of an Animation, Applied Visual Design
2018-10-04freeCodeCamp's Use CSS Animation to Change the Hover State of A Button, Applied Visual Design
2018-10-01freeCodeCamp's Create a More Complex Shape Using CSS and HTML
2018-09-30freeCodeCamp's Create a Graphic Using CSS, Applied Visual Design
2018-09-28freeCodeCamp's Use the CSS Transform Property skewY to Skew
2018-09-28freeCodeCamp's Use the CSS Transform Property skewX to Skew an Element Along the X-Axis
2018-09-27freeCodeCamp's Use the CSS Transform scale Property to Scale an Element on Hover
2018-09-27freeCodeCamp's Use the CSS Transform scale Property to Change the Size of an Element
2018-09-26freeCodeCamp's Create Texture by Adding a Subtle Pattern as a Background Image, url function
2018-09-25freeCodeCamp's Use a CSS Linear Gradient to Create a Striped Element
2018-09-24freeCodeCamp's Create a Gradual CSS Linear Gradient, Applied Visual Design
2018-09-22freeCodeCamp's Adjust the Tone of a Color, Applied Visual Design
2018-09-22freeCodeCamp's Adjust the Hue of a Color, Applied Visual Design
2018-09-21freeCodeCamp's Adjust the Color of Various Elements to Complementary Colors, Applied Visual Design
2018-09-20freeCodeCamp's Learn about Tertiary Colors, Applied Visual Design
2018-09-19freeCodeCamp's Learn about Complementary Colors, Applied Visual Design
2018-09-18freeCodeCamp's Center an Element Horizontally Using the margin Property, Applied Visual Design
2018-09-16freeCodeCamp's Change the Position of Overlapping Elements with the z-index Property
2018-09-15freeCodeCamp's Lock an Element to the Browser Window with Fixed Positioning, Applied Visual Design
2018-09-15freeCodeCamp's Push Elements Left or Right with the float Property, Applied Visual Design
2018-09-15freeCodeCamp's Lock an Element to its Parent with Absolute Positioning, Applied Visual Design


Tags:
applied visual design tutorial
freeCodeCamp
linear gradient tutorial
learn linear greadient