Skip to content

This application allows the user to generate a scheme of colors based on an initial color seed of choice and a scheme mode.

Notifications You must be signed in to change notification settings

aj-pena/colorTheme

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Table of Contents

Description

This application allows the user to generate a scheme of colors based on an initial color seed of choice and a scheme mode. Once the user choices are completed and the 'Get color scheme' button is clicked, the application will perform a fetch request to The Color API and retrieve a collection of 5 colors. Once the color scheme is generated, the user will be able to copy each color's hexadecimal code to the clipboard by clicking on the color strip or the hexadecimal code displayed at the bottom.

Installation

No installation is needed. This application is run in a live webpage.

Usage

To use this application, go to the deployed webpage by followig this link: Visit the deployed page

Image of the Landing Page

Once in the landing page, click on the color picker at the top left to pick a color seed.

Image of color picker

Next, chose a color scheme mode from the dropdown list.

Image of scheme modes from a dropdown list

Click on the 'Get color scheme' button to generate the color scheme based on your choice of seed and scheme mode.

Image of a generated color scheme

Click on the color rectangle or on the hexadecimal code shown below each color strip to copy the hexadecimal code to your clipboard. You are ready now to use it in your code!

Image of alert after copying hexadecimal code to your clipboard

Credits

Third-party assets:

Reference material:

GitHub

If you want to know more details, feel free to visit the repo

Features

  • HTML
  • JavaScript:
    • Variables
    • Arrays
    • Objects
    • EventListeners
    • For Of Loops
    • Fetch
    • API
    • Promises
    • Navigator.Clipboard.writeText()
    • Template literals

About

This application allows the user to generate a scheme of colors based on an initial color seed of choice and a scheme mode.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published