Skip to content

hanifshahy/color_picker

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Color Picker

Welcome to the Color Picker project! This web application allows users to choose and convert colors between five different color models: HEX, HSL, HSLA, RGB, and RGBA. Additionally, it lists all HTML color names for easy reference.

Table of Contents

Features

  • Color Model Support: Easily switch and convert between HEX, HSL, HSLA, RGB, and RGBA color models.
  • HTML Color Names: Access a comprehensive list of HTML color names for quick reference.
  • Real-time Conversion: Instantly see conversions as you input values in any supported color model.
  • User-friendly Interface: Intuitive design to enhance user experience.
  • Daily Color Tip: Receive a new color-related tip every day to expand your knowledge.

Installation

To run this project locally, follow these steps:

  1. Clone the repository:
    git clone https://github.com/hanifshahy/color_piker.git
  2. Navigate to the project directory:
    cd color_piker
  3. Open index.html in your web browser:
    open index.html

Usage

  1. Select a Color Model:
    • Choose between HEX, HSL, HSLA, RGB, and RGBA from the dropdown menu.
  2. Input Color Values:
    • Enter the color values in the input fields provided.
  3. View Conversions:
    • Instantly view the converted color values in other models.
  4. Browse HTML Colors:
    • Refer to the list of HTML color names for quick color selection.

Color Models Supported

  • HEX: Hexadecimal color values (e.g., #FFFFFF for white).
  • HSL: Hue, Saturation, Lightness (e.g., hsl(0, 100%, 50%) for red).
  • HSLA: HSL with Alpha (e.g., hsla(0, 100%, 50%, 0.5) for semi-transparent red).
  • RGB: Red, Green, Blue (e.g., rgb(255, 0, 0) for red).
  • RGBA: RGB with Alpha (e.g., rgba(255, 0, 0, 0.5) for semi-transparent red).

HTML Color Names

The application includes a list of standard HTML color names for easy reference. These colors can be used directly in web design and development.

Daily Color Tip

Receive a daily tip related to colors to enhance your knowledge and skills in color theory and application. Tips can include information about color psychology, color mixing techniques, historical color uses, and more.

Contributing

Contributions are welcome! Please follow these steps to contribute:

  1. Fork the repository: Click the "Fork" button on the top right of the repository page.
  2. Clone your fork:
    git clone https://github.com/your-username/color_piker.git
  3. Create a new branch:
    git checkout -b feature/your-feature-name
  4. Make your changes and commit:
    git add .
    git commit -m "Add your commit message"
  5. Push to your fork:
    git push origin feature/your-feature-name
  6. Submit a pull request: Go to the original repository and click on the "New Pull Request" button.

License

This project is licensed under the MIT License. See the LICENSE file for more details.

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published