Assign a Custom Color with Hex Codes

Playback speed:

Transcript

In the main lesson, you used the Fill color tool to choose a color for your progress bar.

You can also assign a color using a hex color code.

A hex color code is a six-digit code made of numbers and letters.

It is used to specify colors on a screen.

Hex color codes are useful because they produce precise, standard colors, and make colors look consistent across all different browsers.

In this extension, you will change a font color in your presentation using a hex color code.

To begin, open your presentation from your Drive.

Add a title and subtitle to the first slide.

Then, open a new tab in your browser, and do an internet search for hex color codes.

Choose a color for your presentation title.

Copy the hex color code.

Return to your presentation, and select the title.

Open the text color menu and choose Custom.

Paste your hex color code over the value.

Nice work!

You adjusted the title font color with a hex code.

Go back to the color picker, and select a second color for the subtitle.

Copy the hex code.

Return to your presentation, and select the subtitle.

Use the custom text color menu to paste in the new hex code.

Great job!

Keep trying out different colors for your presentation by selecting different hex color codes from the color picker.

Now, it’s your turn: Add a title and subtitle to your presentation.

Search for hex color codes online.

Use a color picker to choose a color for the title.

In the text color tool, choose custom, and paste in the hex color code, and repeat the process for your subtitle.

Choose an extension

Share Your Code

Share your code so that your partner can from your programming to create their own progress bar.

Duplicate Multiple Slides and Extend Your Progress Bar

Insert additional slides in your presentation then run the script editor again so the progress bar appears throughout the entire expanded presentation

Troubleshoot Common Programming Errors

Read and interpret error messages, and solve the problems in your code.

Copy Your Code to Try a New Fill Color

Make a copy of the code and then change the color in your progress bar.

Add a Progress Bar in Google Forms

Make your surveys, quizzes, and forms more user-friendly by showing a progress bar.

Assign a Custom Color with Hex Codes

Change a font color in your presentation using a hex color code.

See more extensions

Dashboard

Instructions

Choose one or more extensions to add more features to your code and learn more ways to use progress bars.