I asked ChatGPT to generate a list of 20, 5-color hexadecimal color schemes for a professional business or sales website. The response spit out a beautiful list in the format of:
Primary: #3498db, Secondary: #2ecc71, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #95a5a6
I decided to take the list and quickly create a visual of the color schemes. This then lead me to want to use Python to parse and clean the output and generate HTML/CSS output. The initial 20 color schemes are shown below.
Doing this became fun and prompted me to want to make a more robust set of scripts to generate an HTML output. So, of course I created a repo. https://github.com/BrettFraley/color-schemes-framework-via-ChatGPT
I plan to make the color scheme framework repo rather robust with options for outputting various types of HTML elements and layout using the color schemes, options to save and store the color schemes in a SQLite database, and UI tools to manipulate and work with color schemes in the browser!
All in all, a simple ChatGPT prompt lead me down a path of creating something fun and hopefully useful to others. I’ll be updating the repo, schemes, and options and calling it complete by the end of January. I’ll be posting links of ‘color scheme pages’ here on this page, and writing more about this fun little project.
| Primary | Secondary | Accent 1 | Accent 2 | Accent 3 |
|---|---|---|---|---|
-
Primary: #3498db, Secondary: #2ecc71, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #95a5a6
-
Primary: #27ae60, Secondary: #34495e, Accent 1: #e67e22, Accent 2: #c0392b, Accent 3: #3498db
-
Primary: #1abc9c, Secondary: #2c3e50, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #3498db
-
Primary: #9b59b6, Secondary: #16a085, Accent 1: #e67e22, Accent 2: #c0392b, Accent 3: #2c3e50
-
Primary: #3498db, Secondary: #2ecc71, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #1abc9c
-
Primary: #27ae60, Secondary: #34495e, Accent 1: #e67e22, Accent 2: #c0392b, Accent 3: #9b59b6
-
Primary: #1abc9c, Secondary: #2c3e50, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #27ae60
-
Primary: #3498db, Secondary: #2ecc71, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #8e44ad
-
Primary: #27ae60, Secondary: #34495e, Accent 1: #e67e22, Accent 2: #c0392b, Accent 3: #9b59b6
-
Primary: #1abc9c, Secondary: #2c3e50, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #3498db
-
Primary: #9b59b6, Secondary: #16a085, Accent 1: #e67e22, Accent 2: #c0392b, Accent 3: #27ae60
-
Primary: #3498db, Secondary: #2ecc71, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #1abc9c
-
Primary: #27ae60, Secondary: #34495e, Accent 1: #e67e22, Accent 2: #c0392b, Accent 3: #9b59b6
-
Primary: #1abc9c, Secondary: #2c3e50, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #27ae60
-
Primary: #3498db, Secondary: #2ecc71, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #8e44ad
-
Primary: #27ae60, Secondary: #34495e, Accent 1: #e67e22, Accent 2: #c0392b, Accent 3: #3498db
-
Primary: #1abc9c, Secondary: #2c3e50, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #9b59b6
-
Primary: #9b59b6, Secondary: #16a085, Accent 1: #e67e22, Accent 2: #c0392b, Accent 3: #27ae60
-
Primary: #3498db, Secondary: #2ecc71, Accent 1: #f39c12, Accent 2: #e74c3c, Accent 3: #1abc9c
-
Primary: #27ae60, Secondary: #34495e, Accent 1: #e67e22, Accent 2: #c0392b, Accent 3: #9b59b6
These color schemes can provide a professional and appealing look for business and sales websites. Adjustments can be made based on specific brand preferences.