Creating beautiful, customizable cover images for your blogs in seconds.
Note: This is an enhanced fork of rutikwankhade/CoverView with additional features and modern tech stack.
- π Super fast and easy to use
- β¨ Unsplash integration to search images
- π 100+ dev icons with option to upload custom icon
- πΎ Export as PNG or WEBP format
- π¨ 9 Color Themes: One Dark, Catppuccin (Latte, FrappΓ©, Macchiato, Mocha), Nord, Tokyo Night, Gruvbox, Solarized, Dracula
- πΌοΈ 7 Visual Themes: Background, Stylish, Basic, Modern, Outline, Preview, Mobile Mockup
- π Multiple Canvas Sizes: 16:9, 4:3, 16:10, 1:1, 3:2 presets with custom dimensions support
- π€ 4 Font Families: Inter, Poppins, Anek Latin, Nunito
- π Dynamic Font Sizing: Adjustable text size for perfect layout
- π Background Patterns: Dots, Zigzag, Cross, and more SVG patterns
- π Internationalization Ready: Multi-language support structure
- β‘ Modern Tech Stack: Vite, React 18, TypeScript, Bun
- π― Auto-format on Save: Prettier with Tailwind CSS plugin
- Frontend: React 18 with TypeScript
- Build Tool: Vite 7.x (migrated from Create React App)
- Package Manager: Bun 1.3+
- Styling: Tailwind CSS with custom patterns
- Code Quality: Prettier with Tailwind CSS plugin
- Image Processing: dom-to-image for export
- API Integration: Unsplash JS SDK
- Bun 1.3 or higher
- Node.js 18+ (if using npm/yarn instead)
# Clone the repository
git clone https://github.com/yourusername/CoverView.git
cd CoverView/
# Install dependencies
bun install
# Set up environment variables
cp .env.example .env
# Edit .env and add your Unsplash API key
# Start development server
bun run dev
# or simply
bun devThe app will be available at http://localhost:3000
# Development
bun run dev # Start dev server
bun run build # Production build
bun run preview # Preview production build
# Code Quality
bun run format # Format all files with Prettier
bun run format:check # Check formatting
bun run build:check # Build with TypeScript type checkingCreate a .env file in the root directory:
VITE_UNSPLASH_ACCESS_KEY=your_unsplash_access_key_hereGet your Unsplash API key from Unsplash Developers
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
- Fork it (https://github.com/rutikwankhade/CoverView/fork)
- Create your feature branch (
git checkout -b feature/fooBar) - Commit your changes (
git commit -am 'Add some fooBar') - Push to the branch (
git push origin feature/fooBar) - Create a new Pull Request
This fork enhances the original CoverView with:
-
More Customization Options
- 9 professionally designed color themes vs original's color picker
- Multiple canvas size presets (16:9, 4:3, etc.)
- Font size adjustment
- Additional font choices
-
Modern Development Stack
- Migrated from Create React App to Vite (faster builds, better DX)
- Full TypeScript support
- Bun package manager for faster installs
- Prettier auto-formatting
-
Better Developer Experience
- Format-on-save with VS Code integration
- Comprehensive documentation (CLAUDE.md)
- Migration guide included
- Better project structure
-
Enhanced UI/UX
- Theme preview system
- Better color scheme organization
- Responsive canvas scaling
- rutikwankhade/CoverView - Original creator and maintainer
- Visit rutik.dev for more awesome projects
- dom-to-image - DOM to image conversion
- Hero Patterns - SVG background patterns
- Devicons - Developer icons
- Unsplash - Beautiful free images
- Tailwind CSS - Utility-first CSS framework
- Vite - Next generation frontend tooling
MIT License - see LICENSE for details
β If you found this useful, please star this repository and the original project!