Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Chris Nunez
Front End Web Development Techdegree Student 3,512 PointsSomething worth noting is that you can preview the direction of the color gradient when hovering over the CSS properties
Just to clarify, in certain development environments or tools, when you hover over the CSS properties for a gradient, it shows a preview of the color gradient direction. This can be incredibly useful for developers as it allows them to visualize the gradient without having to constantly refresh their page.
Here’s an example:
If you hover over “(30deg, #cc4e13, papayawhip);” in the following code:
background-image: linear-gradient(30deg, #cc4e13, papayawhip);
Any modifications you make to the degree or color will be previewed right above it. This feature can save a lot of time and make the process of designing with gradients much more efficient.
1 Answer
Steven Parker
231,275 PointsAnd for those who are not using tools with that feature built-in, there are many web tools available that display the final result as you create the code, or allow you to make the gradient visually and then create the code for you.
A few popular examples include (and there are many others):
Chris Nunez
Front End Web Development Techdegree Student 3,512 PointsChris Nunez
Front End Web Development Techdegree Student 3,512 PointsAmazing info, thank you!