Weather Dashboard
Enter your weather app requirements and get build instructions using the OpenWeatherMap API for current conditions, a 5-day forecast, location search, auto-location, unit switching, and alerts.
| Category | Development › Coding |
|---|---|
| Tags | DraftingDeveloperCode |
Build a comprehensive weather dashboard using HTML5, CSS3, JavaScript and the OpenWeatherMap API. Create a visually appealing interface showing current weather conditions with appropriate icons and background changes based on weather/time of day. Display a detailed 5-day forecast with expandable hourly breakdown for each day. Implement location search with autocomplete and history, supporting both city names and coordinates. Add geolocation support to automatically detect user's location. Include toggles for temperature units (°C/°F) and time formats. Display severe weather alerts with priority highlighting. Show detailed meteorological data including wind speed/direction, humidity, pressure, UV index, and air quality when available. Include sunrise/sunset times with visual indicators. Create a fully responsive layout using CSS Grid that adapts to all device sizes with appropriate information density.
What this prompt does
Suitable for implementing a weather dashboard UI. It requests backgrounds based on time and weather plus detailed meteorological data, but availability depends on OpenWeatherMap responses.
More in this category
| E COMMERCE WEBSITE | |
| Plataforma Escopo Bugbouty Cyber Hunter Lab | |
| Voice Cloning Assistant | |
| 2046 Puzzle Game Challenge | |
| 21st.dev component prompt |
Weather Dashboard