Realtime Colors site but much cleaner implementation in Astro + Solid + UnoCSS
baseURL: https://astrocolors.vercel.app
GET /api
=> Returns the randomly generated color values with realtimecolors algorithm
GET /colorset
=> Returns the predefined set of beautiful colors in realtimecolors
Returned variables:
text
- text colorbg
- backrgound colorsprimary
- primary colorsecondary
- secondary colotaccent
- accent color
Suffix .css
to get the color values as css variables as in _/api.css
or _/colorset.css
For example:
@import url('https://astrocolors.vercel.app/api.css');
Will return the css with variables:
:root {
--rc-text: #..., /*The hex colorcode for text*/
--rc-bg: #...; /*The hex colorcode for background*/
--rc-primary: #...; /*The primary color hexcode*/
--rc-secondary:#...; /*The secondary color hexcode*/
--rc-accent: #...; /*The accent color hexcode*/
}
Suffix .txt
to get the variable as dash-separated text as in _/api.txt
or _/colorset.txt
'text-bg-primary-secondary-accent'
- Starlight for the docs
- UnoCSS for Icons & Styling css
- Dexie for storing user themes in IndexedDB (Browser's Database)
- SolidJS for updating frotnend UI in a much cleaner and efficient way
- nanostores for managing state between different parts of the website
- Astro for providing the backend service for rendering & the REST API
- qrcode
- FileSaver
- zip