A visual tool for comparing digital camera pixel resolutions.
- Select from various megapixel options (10MP, 20MP, 30MP, 40MP, 60MP, 100MP)
- Visualize relative sizes of different resolutions
- Interactive UI with responsive design
- Precise pixel dimension calculations based on industry standard 3:2 aspect ratio
- Node.js 14+ and npm
- Clone the repository
- Install dependencies:
cd mega-comparison
npm install
To start the development server:
npm run dev
This will start the application at http://localhost:5173
.
To build the application for production:
npm run build
This will generate optimized files in the dist
directory.
The application:
- Calculates the relative dimensions of each megapixel resolution based on a 3:2 aspect ratio
- Displays blocks representing each selected resolution
- Arranges blocks in order (smaller to larger) for easy comparison
- Aligns all blocks at their centers
- React
- TypeScript
- Vite
- Tailwind CSS