• Townie
    AI
  • Blog
  • Docs
  • Pricing
  • We’re hiring!
Log inSign up
willemhelmet

willemhelmet

css-gradient-generator

Remix of jxnblk/react-router-hono-starter
Public
Like
css-gradient-generator
Home
Code
7
.vtignore
AGENTS.md
README.md
client.tsx
deno.json
routes.tsx
H
server.tsx
Branches
1
Pull requests
Remixes
History
Environment variables
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
Sign up now
Code
/
Code
/
Search
server.tsx
https://willemhelmet--0199badeb98a76aab758b50df12c19a9.web.val.run
README.md

✨ Zodiac CSS Gradient Generator

This is a web-based tool for creating beautiful CSS gradients with a unique twist: the gradients are generated based on your zodiac sign and the current cosmic season.

🎨 Features

  • Zodiac-Based Generation: Select your zodiac sign to generate a unique gradient.
  • Seasonal & Astrological Colors: Gradients are influenced by the current season and the ruling zodiac sign, creating a color palette that reflects the time of year.
  • Time of Day Awareness: Gradients are subtly adjusted to be darker during the night.
  • Full Customization:
    • Choose between linear and radial gradients.
    • Adjust the angle of linear gradients.
    • Add, remove, and edit color stops, including their color and position.
  • Save Your Favorites: Save your custom gradients to your browser's local storage for later use.
  • Copy CSS: Easily copy the generated CSS to your clipboard.

🔮 How It Works

The initial gradient is created by combining the colors associated with your chosen zodiac sign and the colors of the current zodiac sign. The colors are also adjusted based on the current season (Spring, Summer, Fall, or Winter) to create a palette that is in harmony with the time of year.

Once the initial gradient is generated, you have complete control to customize it to your liking.

🛠️ Tech Stack

  • Backend: Hono on Deno
  • Frontend: React (with Hooks)
  • Routing: React Router
  • Styling: Twind

🚀 Running the Project

This project is designed to run on Val Town.

To run it locally, you will need to have Deno installed. Then you can run the following command:

deno run -A server.tsx
HTTP
  • server.tsx
    willemhelmet--01…a9.web.val.run
Code
.vtignoreAGENTS.mdREADME.mdclient.tsxdeno.jsonroutes.tsx
H
server.tsx
FeaturesVersion controlCode intelligenceCLI
Use cases
TeamsAI agentsSlackGTM
DocsShowcaseTemplatesNewestTrendingAPI examplesNPM packages
PricingNewsletterBlogAboutCareers
We’re hiring!
Brandhi@val.townStatus
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Open Source Pledge
Terms of usePrivacy policyAbuse contact
© 2025 Val Town, Inc.