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.
- 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.
To run this project locally, follow these steps:
- Clone the repository:
git clone https://github.com/hanifshahy/color_piker.git
- Navigate to the project directory:
cd color_piker
- Open
index.html
in your web browser:open index.html
- Select a Color Model:
- Choose between HEX, HSL, HSLA, RGB, and RGBA from the dropdown menu.
- Input Color Values:
- Enter the color values in the input fields provided.
- View Conversions:
- Instantly view the converted color values in other models.
- Browse HTML Colors:
- Refer to the list of HTML color names for quick color selection.
- 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).
The application includes a list of standard HTML color names for easy reference. These colors can be used directly in web design and development.
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.
Contributions are welcome! Please follow these steps to contribute:
- Fork the repository: Click the "Fork" button on the top right of the repository page.
- Clone your fork:
git clone https://github.com/your-username/color_piker.git
- Create a new branch:
git checkout -b feature/your-feature-name
- Make your changes and commit:
git add . git commit -m "Add your commit message"
- Push to your fork:
git push origin feature/your-feature-name
- Submit a pull request: Go to the original repository and click on the "New Pull Request" button.
This project is licensed under the MIT License. See the LICENSE file for more details.