Skip to content

Latest commit

 

History

History
47 lines (29 loc) · 1.61 KB

readme.md

File metadata and controls

47 lines (29 loc) · 1.61 KB

Color Scheme Picker

screenshot

How does the app work?

  • User picks a "seed color", selects a color scheme (monochrome, complement, etc.), clicks a button to get the color scheme and the colors display in a column - including the HEX values for each color.

Process

  • Consult Figma design files
  • Create draft of README file
  • Create .gitignore file and check that meta tag is included
  • Create Github repository
  • Work on HTML, CSS and JS files
  • Check final code and accessibility
  • Finalize README file
  • Publish live URL

Considerations along the way

  • Made sure a sample color scheme is displayed on page load
  • Added a clipboard functionality
  • Made the app responsive
  • Added light-dark mode

Resources:

How to create a dropdown list

Copy text to clipboard

Light/Dark Mode toggle

How to create a dark/light theme toggle

How to make tooltips with only CSS

tippy.js

sweet alert

W3 Schools: How to - Snackbar / Toast

MDN: ARIA: checkbox role

Accessible toggle buttons