Mythical Menagerie

A digital bestiary for mythological creatures

• Explore legendary beings from global mythologies.
• Search, learn, and even create mash-ups of monsters with our interactive generator.
• An interactive web application for exploring legendary creatures from folklore and mythology. It presents each creature with an image, description, lore, and tags. The application allows searching, random selection, mash-up generation, and saving custom creations.

---

Features

• Gallery View: Grid of creature cards with images, lore, and tags.
• Coverflow View: 3D carousel that highlights one creature at a time.
• Search and Filter: Search by name, region, or tags.
• Monster Mash-Up: Randomly combine two creatures into a new hybrid.
• My Horrors: Save mash-ups to a personal gallery and download them as images.
• Download Posters: Export any creature card as an image file.
• Mythology Tags: Greek, Celtic, Native American, Slavic, Nordic, Urban Legends

---

Data Source

The creature data is maintained in a Google Sheet and fetched in CSV format.

Public CSV link:

https://docs.google.com/spreadsheets/d/e/2PACX-1vSUTVPaArehQ_-Z5jnuhJH9rEIvYmNLe8tLeNoqnaiS9znSr3wZA-rWLnS7ZnMLxgW0im_0zeVy9uDp/pub?gid=0&single=true&output=csv

For clarity, the sheet follows this format:

• id
• name
• region
• types
• tags
• abilities
• weaknesses
• appearance
• lore
• image

---

Tech Stack

• Languages: HTML5, CSS3, JavaScript (ES6+ modules)
• Frameworks / Libraries:
  • TailwindCSS – utility-first styling
  • html2canvas – export posters and cards as images
• Build Tool: Vite – fast development server and bundler
• Data Source: Google Sheets (CSV export)
• Hosting: GitHub Pages (or Vercel/Netlify if deployed there)
• Version Control: Git + GitHub

---

Images

Example:

---

Running Locally

Clone the repository and run with Vite:

git clone https://github.com/ginesthoii/mythical-menagerie.git
cd mythical-menagerie
npm install
npm run dev
Then open: http://localhost:5173