Martín Casais Labs
Back to Entries

Web3 Horoscope

Fun Web3 dApp that generates a personalized daily horoscope from your Ethereum address, including zodiac traits, rarity, advice, challenges, and shareable exports.

ReactwagmiRainbowKit
View RepoLive Demo

Overview

Web3 Horoscope is a playful, “onchain-inspired” dApp that generates a unique horoscope from your Ethereum wallet address. Connect your wallet and instantly reveal your zodiac sign, element alignment, lucky traits, rarity score, advice, daily challenge, and more, all derived deterministically from the address (plus a daily rotation for fresh predictions).

What it demonstrates

  • Wallet-first UX: connect → compute identity → share/export results
  • Deterministic trait generation from an address (pseudo-random mapping)
  • Rich UI polish: animations, particles, glow/fade, responsive layout
  • Practical sharing features (copy, export image, social sharing)

Key features

  • Wallet connection via RainbowKit + wagmi
  • Address-based identity: traits generated from your wallet address
  • Zodiac sign + elemental alignment (Fire / Earth / Air / Water)
  • Lucky color, lucky number, rarity score
  • Daily “Web3 fortune”, advice, mood, and challenge
  • Lucky NFT + protocol suggestions + lucky time
  • Copy to clipboard + export as image + share to socials
  • Responsive animated UI powered by Tailwind

This project is for entertainment only, no astrological, financial, or spiritual advice is being given.

Live demo

Quickstart

Bash
git clone https://github.com/casaisdev/web3-horoscope.git

See the README for setup/env vars (WalletConnect Project ID).

Where to customize

  • src/utils/horoscope.js: core logic (signs, colors, advice, rarity)
  • src/components/: modular UI components

Notes

  • You need a WalletConnect Cloud Project ID for the RainbowKit connection.
  • Trait generation is address-derived (deterministic), while the “daily” part can rotate to keep results fresh.
  • Sharing/export uses html2canvas, so some visual effects can render slightly differently in the exported image depending on the browser.

Next steps

If I were to extend Web3 Horoscope further:

  • Add “seed explainability” (show which address bytes map to which traits)
  • Add more export templates (OG-card layouts) + caching for faster repeats
  • Add optional chain-aware themes (Base / Arbitrum vibes) without changing the core UX