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

Build a Color Tool in Vanilla JavaScript

Enroll for freeGet started!

Join 5318 other students

Log in to get

Access to all our free courses
Interactive hands-on content
100s of code challenges
Join a friendly community
Enroll for free
Subscribe to access!Subscribe to access!

Subscribe to access to this course and ALL other courses. You get a 30-day money-back guarantee, no questions asked.

Subscription includes

All courses and career paths
100s of coding challenges
Certificates of completion
Exclusive Pro members chat
The course creator James Q Quick

with James Q Quick

Course level: Intermediate

Build a cool color lighten/darken tool from scratch and sharpen up your HTML, CSS and vanilla JavaScript skills along the way!

You'll learn

Check for a valid hex color

Convert hex to RGB

Display percentage from slider

Alter color by percentage

Create a toggle

Reset functionality

parseInt

textContent

Math.min and Math.max

HTML DOM style Property

man

Prerequisites

Before taking this course, you should have a solid understanding of HTML, CSS and JavaScript.

Meet your teacher

The course creator

James Q Quick

Web Developer, Speaker, and Teacher.

Follow me on twitter

Why this course rocks

This course hones your HTML, CSS and vanilla JavaScript skills by building a color lighten/darken tool. Throughout the 19 lessons, you’ll solve several interactive challenges which will test your coding knowledge and let you in on a few handy hints along the way.

You’ll build out the skeleton HTML, style it with CSS and add a range of interactive features using vanilla JS - no frameworks required!

By the end of the course, you’ll have built a large project which will look great on your portfolio or pushed to your Github profile - so dive right in and get ready for a colour-switching fun rollercoaster!

Join the community!

Learning alone can be lonely. Click here to join our Discord server and connect with other Scrimba learners!

F to the A oracle to the Q
Who is this course for?

This is the perfect course for anyone who wants to practice their JavaScript by building a fun project.