Interactive scrolling website for the QWAMI token - the native utility token that powers KWAMI AI companions.
QWAMI is the native KWAMI ecosystem token that powers AI companions and distributes weekly dividends every Friday. Holders can recharge KWAMI capabilities, stake for rewards, and earn passive income from marketplace and minting profits.
- 💰 Weekly Dividends - Earn 80% of ecosystem profits every Friday
- 🔒 Staking - Stake for APY rewards while maintaining dividend eligibility
- ⚡ Energy - Powers AI API calls (ElevenLabs, OpenAI) and DAO voting
- 🔗 Connections - Expands app integration capacity (Instagram, WhatsApp, Gmail, etc.)
- 🦋 Metamorphosis - Unlocks multiple KWAMI configurations (Mind, Soul, Body)
- Price: 1 QWAMI = $0.01 USD
- Max Supply: 1,000,000,000,000 (1 Trillion)
- Decimals: 0 (Integer token)
- Network: Solana SPL
- Model: Deflationary (burn-based) + Revenue sharing
- Dividends: 80% of profits distributed weekly
- Revenue: market.kwami.io + candy.kwami.io
- Framework: Nuxt 3 (SPA mode)
- Styling: Custom CSS with animations
- Network: Solana blockchain
- Inspiration: kwami.io landing page style
- Node.js 18+ or Bun
- Modern web browser
# Install dependencies
npm install # or bun install
# Start development server
npm run dev # or bun dev# Type check and build
npm run build:check # or bun run build:check
# Build only
npm run build # or bun build
# Preview production build
npm run preview # or bun previewqwami/
├── app/ # Application code (Nuxt 4 structure)
│ ├── app.vue # Root application component
│ ├── pages/
│ │ └── index.vue # Main landing page
│ └── assets/
│ ├── css/
│ │ └── main.css # Global styles and animations
│ └── js/
│ └── main.ts # Client-side TypeScript logic
│
├── server/ # Server-side code (API routes)
│ └── api/ # Future API endpoints
│
├── public/ # Static assets
│ └── favicon.svg
│
├── nuxt.config.ts # Nuxt configuration
├── tsconfig.json # TypeScript configuration
├── package.json # Dependencies and scripts
│
└── docs/ # Documentation
├── README.md
├── QWAMI_TOKEN.md # Token specifications
├── DEPLOYMENT.md # Deployment guide
└── CHANGELOG.md # Version history
- Introduction - Overview of QWAMI token
- What is QWAMI - Core concept and utility
- Energy - AI API fuel and DAO voting power
- Connections - App integration expansion
- Metamorphosis - Multiple KWAMI configurations
- Tokenomics - Supply, price, deflationary model
- Weekly Dividends - 80% profit sharing every Friday
- Staking - APY rewards + dividend eligibility
- DAO Governance - Community participation
- How to Get QWAMI - Purchase methods
- Burning Mechanism - Token destruction mechanics
- KWAMI NFT Integration - NFT synergy
- Ecosystem Revenue - Marketplace and minting profits
- Security & Audits - Code quality assurance
- Roadmap - Future development
- Get Started - CTA and documentation
- Animated 3D blob visualization (Three.js, inspired by kwami.io) ✅
- Smooth scroll transitions between sections
- Dynamic color palettes per section
- Interactive sidebar navigation with spheres
- Responsive design for mobile and desktop
- Custom cursor light effect (desktop only)
- Click sidebar spheres to navigate sections
- Scroll to progress through content
- Action buttons for external links
- Smooth transitions and animations
This landing page is designed to:
- Educate users about QWAMI token utility
- Explain Energy, Connections, and Metamorphosis features
- Drive traffic to mint/purchase interfaces
- Showcase tokenomics and ecosystem
- Build community engagement
QWAMI is part of the broader KWAMI ecosystem:
- kwami.io - Core AI companion framework
- qwami.io - QWAMI utility token (this site)
- quami.io - Services and integrations platform
- candy.kwami.io - KWAMI NFT minting
For detailed information about:
- Token specifications: See
docs/QWAMI_TOKEN.md - Smart contracts: See
contracts/idl/README.md - KWAMI Framework: Visit kwami.io
- GitHub: github.com/alexcolls/kwami
- app/pages/index.vue - Main landing page with 16 informative sections
- app/assets/js/main.ts - Scroll management, navigation, color transitions
- app/assets/css/main.css - Responsive styles, animations, visual effects
- nuxt.config.ts - Nuxt configuration (SPA mode)
ScrollManager- Handles section transitions and color updatesSidebarNavigator- Manages navigation spheresCursorLight- Custom cursor light effectActionButtonManager- Handles CTA button interactions
Each section uses a distinct color palette from Tailwind's color spectrum:
- Violet (primary QWAMI color)
- Pink, Amber, Emerald, Cyan, Blue, Indigo, etc.
Palettes transition smoothly as users scroll between sections.
The landing page follows kwami.io's aesthetic:
- Informative - Clear, concise explanations
- Interactive - Smooth animations and transitions
- Modern - Clean typography and layout
- Accessible - Responsive and mobile-friendly
- On-brand - Consistent with KWAMI ecosystem
- Live Site: qwami.io
- GitHub: github.com/alexcolls/kwami
- Mint KWAMI: candy.kwami.io
- Framework: kwami.io
This is part of the KWAMI ecosystem. For contributions:
- Fork the repository
- Create a feature branch
- Make your changes
- Submit a pull request
See the main KWAMI repository for guidelines.
Part of the KWAMI project. Check the main repository for license details.
Status: Production Ready
Version: 1.0.0
Network: Solana
Token: QWAMI
Built with 💜 for the KWAMI community