A modern, responsive companion web app for One Piece Bounty Rush (OBPR), designed to help players easily explore character stats, view detailed info, and enhance their gameplay. Built with performance, style, and user experience in mind.
Experience the full app in action! Browse characters, explore medal sets, and toggle themes.
Take the OBPR experience with you! The companion app is also available on mobile platforms:
| Platform | Repository | Description |
|---|---|---|
| iOS (Swift) | opbr-companion-web-2 | Native iOS app with the same features |
| Android (Kotlin) | opbr-companion | Native Android app with the same features |
- 🔍 Character Database – Search, filter, and view character profiles.
- 🌗 Light/Dark Mode – Toggle between clean light and sleek dark themes.
- 📱 Fully Responsive – Optimised for both desktop and mobile use.
- 🎮 One Piece Inspired UI – Styled to match the anime's personality and flair.
- 🎞 Smooth Animations – Framer Motion enhances transitions and interactions.
- ⚡ Fast Performance – Server-side rendering and code splitting with Next.js.
| Area | Tech Used |
|---|---|
| Frontend Framework | Next.js |
| Styling | Tailwind CSS, DaisyUI |
| Animations | Framer Motion |
| Icons | React Icons |
| Hosting | Netlify |
| State Management | React Hooks & Context API |
| Version Control | Git & GitHub |
The app supports both Light and Dark themes with a One Piece vibe:
- Background:
#F5F5F5 - Text:
#212121 - Primary Button:
#3F8CFF - Highlight:
#FFD700(Gold)
- Background:
#181A1B - Text:
#E0E0E0 - Primary Button:
#3F8CFF - Highlight:
#FFD700
Accessible, bold, and fun – just like the Straw Hats.
/characters - Character pages (dynamic) /components - Reusable components (cards, UI elements, etc.) /hooks - Custom React hooks /styles - Tailwind config and global styles /lib - Utility functions and helpers /public - Static assets (images, icons) /config - Theme and meta config
- Node.js 18+
- npm or yarn
# Clone the repository
git clone https://github.com/your-username/obpr-companion.git
# Navigate into the project
cd obpr-companion
# Install dependencies
npm install
# or
yarn installnpm run dev
# or
yarn devThis project uses the MIT License.
Use at your own risk. No warranties or guarantees are provided regarding data loss, misuse, or app behaviour.