🌐 OpenRouter Models Explorer

A modern web application for exploring and filtering AI models available through OpenRouter.

✨ Features

🔍 Advanced Filtering

• Provider-based filtering
• Modality selection (text, image, etc.)
• Pricing type filtering (Free/Paid)
• Context length filtering
• Comprehensive search functionality

💫 Modern UI/UX

• Professional purple and pink gradient theme
• Glass-morphism design elements
• Responsive layout
• Dark mode optimized
• Clean, organized filter controls

📊 Data Display

• Provider icons for quick recognition
• Clear pricing information
• Free model indicators
• Context length visualization
• Sortable columns

🛠️ Technical Features

• Real-time filtering
• Local storage caching
• Error handling with retries
• Responsive design
• Modern animations

🚀 Getting Started

Local Development

1. Clone the repository
2. Open index.html in a modern web browser
3. Start exploring AI models!

Deploying to GitHub Pages

1. Create a GitHub repository

   git init
   git add .
   git commit -m "Initial commit"
   git branch -M main
   git remote add origin https://github.com/yourusername/your-repo-name.git
   git push -u origin main

2. Deploy to GitHub Pages

   • Go to your repository on GitHub
   • Click on "Settings"
   • Scroll down to "GitHub Pages" section
   • Under "Source", select "main" branch
   • Click "Save"
   • Your site will be published at https://yourusername.github.io/your-repo-name

   Alternatively, you can use GitHub CLI:

   # Enable GitHub Pages in your repository settings
   gh repo edit --enable-pages
   # Set the publishing source to the main branch
   gh repo edit --default-branch main

3. Verify Deployment

   • Wait a few minutes for GitHub to build and deploy your site
   • Visit https://yourusername.github.io/your-repo-name
   • Your OpenRouter Models Explorer should now be live!

🔧 Technologies

• HTML5
• CSS3 with modern features
• JavaScript (Alpine.js)
• Tailwind CSS
• Font Awesome icons

📱 Browser Support

Optimized for modern browsers with support for:

• CSS Grid
• Flexbox
• CSS Variables
• Backdrop Filter
• Modern JavaScript

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

📄 License

MIT License