Alt Text Generator

A web application that helps generate meaningful alt text for images using AI. This tool follows accessibility best practices and helps ensure your images are accessible to everyone.

Features

• Drag-and-drop or click-to-upload image functionality
• Supports JPEG, PNG, GIF, and WebP formats
• Context-aware alt text generation
• Detailed image descriptions
• Real-time preview
• Accessibility-first design
• Built with AI-powered image analysis

How It Works

1. Upload an Image: Either drag and drop an image or click to select one from your device.
2. Add Context: Provide information about where the image will appear on your website or application.
3. Generate: Click the "Generate Alt Text" button to analyze the image.
4. Review Results: You'll receive both:
   • A concise alt text suitable for the alt attribute
   • A detailed description of the image

Best Practices for Alt Text

This tool follows these key principles:

• Keeps descriptions concise and meaningful
• Includes text that appears in images
• Marks decorative images appropriately
• Considers context when generating descriptions
• Focuses on the purpose and meaning of images, not just visual details
• Keeps descriptions concise for optimal screen reader experience

Technical Details

The application is built using:

• Next.js for the framework
• React for the UI
• Tailwind CSS for styling
• Claude AI for image analysis and text generation
• Shadcn/UI for accessible component primitives

Project Status

This is an alt text generator project that uses AI to help create accessible image descriptions. If you're interested in using or building upon this project, feel free to:

• Try it out
• Suggest improvements
• Share your feedback
• Fork the project for your own use

Note: Formal contribution guidelines haven't been established yet. If you're interested in contributing, please reach out to discuss possibilities.

License

License information pending. Please add appropriate licensing terms for your project.

Acknowledgments

• Built with accessibility guidelines from WCAG 2.1
• Uses Anthropic's Claude AI for intelligent image analysis
• UI components from Shadcn/UI library