This project was created by Stefan Klinkusch at Digital Career Institute in Berlin, Germany.
It uses the color-convert package to perform the following color conversions:
- CSS color name ➡ RGB values
- RGB values ➡ HSL values
- RGB values ➡ hexadecimal color code
- hexadecimal color code ➡ RGB values
Furthermore, there is a statistic about how often a color is converted. This statistic file can also be displayed.
- Node.js
- Express
- GET requests
- router
- middlewares
- lowdb
- Clone the repository using
git clone git@github.com:sklinkusch/express-color.git
(SSH) orgit clone https://github.com/sklinkusch/express-color
(HTTPS). - Move into the directory
express-color
and runnpm install
oryarn
. - Run
npm run dev
oryarn dev
in the folder. The server is available onhttps://localhost:3000
.
Requests can be made in the browser or within JavaScript files using XMLHttpRequest
, fetch
, or axios
.
Input:
https://localhost:3000/convert/keywordtorgb?color=$COLOR
Example:
https://localhost:3000/convert/keywordtorgb?color=hotpink
Your output contains a JSON object with the values for red, green, and blue.
Output:
{
"red": 255,
"green": 105,
"blue": 180
}
Input:
https://localhost:3000/convert/rgbtohsl?color=$RED,$GREEN,$BLUE
Example:
https://localhost:3000/convert/rgbtohsl?color=255,105,180
Your output contains a JSON object with the values for hue, saturation, and luminance.
Output:
{
"hue": 330,
"saturation": 100,
"luminance": 71
}
Input:
https://localhost:3000/convert/rgbtohex?color=$RED,$GREEN,$BLUE
Example:
https://localhost:3000/convert/rgbtohex?color=255,105,180
Your output contains a JSON object with a single hex value.
Output:
{
"hex": "FF69B4"
}
Input:
https://localhost:3000/convert/hextorgb?color=$HEXCODE
Example:
https://localhost:3000/convert/hextorgb?color=FF69B4
Your output contains a JSON object with the values for red, green, and blue.
Output:
{
"red": 255,
"green": 105,
"blue": 180
}
It shows for the conversion CSS color name ➡ RGB values the quantity how often a certain color was converted on your system. The data is read from a db.json
file that is created during the procession of the first request.
Input: https://localhost:3000/statistics
Output:
{
"colorStatistics": {
"hotpink": 10
}
}
In this section, common errors are shown and what is the reason for these errors.
If you see in your browser an output like
{
"error": {
"message": "missing query parameter 'color'"
}
}
then you have made a query for a color conversion without providing a color. The right syntax is one of these:
https://localhost:3000/convert/keywordtorgb?color=yellow
https://localhost:3000/convert/rgbtohsl?color=255,0,0
https://localhost:3000/convert/rgbtohex?color=0,128,0
https://localhost:3000/convert/hextorgb?color=0000ff
If you see an output like
{
"error": {
"message": "yellow is not a valid input for rgb conversion"
}
}
then the color you provided has not the correct format. The correct format for
- keyword conversion is one lowercase word without numbers or special characters,
- rgb conversion is consisting of three integers (minimum: 0, maximum: 255) separated by commas,
- hex conversion is consisting of six characters (lowercase or uppercase, all numbers and characters from a to f).
If you see an output, such as
{
"error": {
"message": "The color hottpink does not exist."
}
}
then the color has the right format, but it is not existing. Possible reasons are:
- a typo in the keyword or
- rgb values that are out of range (lower than 0 or higher than 255)
If you see an output like
{
"error": {
"message": "The requested conversion of yellow from keyword to hsl is currently not supported."
}
}
then you asked for a conversion that is not included in this app. Until now, only these conversions are included:
- CSS color name (keyword) ➡ RGB values (rgb)
- RGB values (rgb) ➡ HSL values (hsl)
- RGB values (rgb) ➡ hexadecimal color code (hex)
- hexadecimal color code (hex) ➡ RGB values (rgb)
The color conversion is not done with an arbitrary precision. Chained conversions may lead to unexpected results.