HaikuReadme

✨ Generate beautiful, tech-themed haiku SVGs for your GitHub README!

HaikuReadme generates poetic, customizable haiku SVGs you can embed in your GitHub profile. Choose from themes, layouts, and border styles — perfect for developers with a love for code and creativity.

🔗 Live demo: HaikuReadme Web

---

🚀 Features

• 🎨 Customizable themes: catppuccin_mocha, dracula, cyberpunk, and more
• 🧱 Layouts: vertical, horizontal, and compact
• 🎁 Embeddable: Drop into any README with one line
• 💡 Automatically updated: Hourly haiku refresh (via GitHub Actions)
• 🌍 Mobile-friendly frontend for on-the-go customization
• 🤝 Open source: Add your own templates, themes, or words!

---

📦 Usage

Embed this in your GitHub README:

![HaikuReadme](https://chinmay29hub-haiku-readme.vercel.app/api?theme=catppuccin_mocha&type=vertical&border=true&t=1746839043)

🔧 Query Parameters

Parameter	Description	Options	Default
theme	Color scheme	catppuccin_mocha, dark, dracula, nord, tokyo_night, gruvbox_dark, solarized_dark, cyberpunk	catppuccin_mocha
type	Layout style	vertical, horizontal, compact	vertical
border	Show border	true, false	true

✨ Examples

• Dracula theme, horizontal layout, no border:

  ![HaikuReadme](https://chinmay29hub-haiku-readme.vercel.app/api?theme=dracula&type=horizontal&border=false&t=1746839043)

• Cyberpunk theme, compact layout:

  ![HaikuReadme](https://chinmay29hub-haiku-readme.vercel.app/api?theme=cyberpunk&type=compact&border=true&t=1746839043)

---

🎨 Theme Previews

Theme	Preview
catppuccin_mocha
dracula
cyberpunk

Explore more themes at HaikuReadme Web

---

🛠️ Installation & Deployment

...

🔁 Automated Updates (Optional)

The haiku SVG updates every hour using a GitHub Action.
This ensures fresh content and bypasses Vercel's response caching.

GitHub Action Workflow

name: Haiku Generator

on:
  push:
    branches:
      - main
  schedule:
    - cron: '0 * * * *' # Every hour
  workflow_dispatch:

permissions:
  contents: write

jobs:
  update-readme:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout the code
        uses: actions/checkout@v3

      - name: Update README with Random Haiku
        uses: chinmay29hub/haiku-readme@v1

See the workflow file in .github/workflows/update-readme.yml.

---

🛠️ Installation & Deployment

# Clone the repository
git clone https://github.com/chinmay29hub/haiku-readme.git

# Navigate to project
cd haiku-readme

# Install backend dependencies
cd backend
npm install

# Install frontend dependencies
cd ../frontend
npm install

# come back to root directory
cd ..

# Build the project
npm run build

# Deploy to Vercel
cd ..
vercel

Update your README with your deployed URL.

---

🧪 Local Development

# Start backend
cd backend
npm start

# Start frontend
cd ../frontend
npm run dev

Or use one command to run both:

npm run dev

API will be available at:
http://localhost:3000/api?theme=catppuccin_mocha&type=vertical&border=true

---

⚙️ Environment Variables

Create a .env file in the frontend directory:

For local dev:

VITE_API_URL=http://localhost:3000

---

🤝 Contributing

We welcome contributions from everyone! Check out the CONTRIBUTING.md to get started.

💡 Contribution Ideas

• Add new themes or layouts
• Expand word sets and haiku templates
• Improve UI/UX (animations, responsiveness, accessibility)
• Refactor backend or add tests

Before contributing, please read our Code of Conduct to ensure a respectful community experience.

💡 Contribution Ideas

• Add more themes/layouts
• New word sets or seasonal haikus
• Improve UI/UX (toggle dark/light, animations, etc.)

---

🌍 Community

• Issues – Bug reports & feature requests
• Discussions – Ideas and feedback
• Code of Conduct – Be kind and inclusive

---

📄 License

Licensed under the MIT License.

---

👏 Acknowledgments

• Inspired by devs who mix poetry and code
• Color palettes from Catppuccin
• Powered by Vercel, React, Express

---

✨ Contributors

Thanks to everyone who contributes!

---

Made with 💻 and ☕ by Chinmay Sonawane