Image Viewer

A beautifully designed, minimalist web application for viewing images from URLs. Inspired by modern design principles with a clean, OpenAI-like aesthetic.

• Minimalist Design: Clean, modern interface with glassmorphism effects
• Gradient Background: Beautiful purple-to-blue gradient backdrop
• Smooth Animations: Subtle hover effects and transitions
• Responsive Layout: Works perfectly on desktop and mobile
• One-Click Examples: Quick access to test images
• Copy URL Feature: Easy sharing with clipboard integration
• Error Handling: Graceful error states with helpful messages
• Loading States: Elegant loading animations and button states

• Typography: Inter font family for crisp, modern text
• Glass Effect: Frosted glass card with backdrop blur
• Micro-interactions: Hover animations and focus states
• Color Palette: Emerald green accents with neutral grays
• Spacing: Generous whitespace for clean visual hierarchy

1. Enter URL: Paste any image URL in the input field
2. Click View: Hit the green "View" button or press Enter
3. Enjoy: Your image appears with smooth animations
4. Copy URL: Use the copy button to share the image URL
5. Try Examples: Click example buttons for quick testing

• Random Photo: https://picsum.photos/600/400
• Custom Placeholder: https://via.placeholder.com/500x300/4f46e5/white?text=Hello+World
• Test Image: https://httpbin.org/image/jpeg

• Framework: Single-file Val Town HTTP endpoint
• Styling: Custom CSS with TailwindCSS utilities
• Fonts: Google Fonts (Inter family)
• Effects: CSS backdrop-filter for glass morphism
• Animations: CSS keyframes for smooth transitions
• Icons: Inline SVG icons for crisp rendering

• GET / - Serves the main HTML interface
• POST /preview - Processes image URL for display
  • Request body: { "url": "https://example.com/image.jpg" }
  • Response: { "success": true, "imageUrl": "https://example.com/image.jpg" }

The application handles various error cases:

• Empty URL input
• Invalid URL format
• Images that fail to load (shows error message)
• Network errors during processing

All errors are displayed to the user with clear, actionable messages.