Weather Dashboard
Turn any AI chat into a weather dashboard with this community persona prompt.
f · awesome-chatgpt-promptsUpdated 2026-07-082,416 copies
Weather Dashboard is a community-contributed prompt from awesome-chatgpt-prompts (CC0). Copy it, fill in any variables, and paste it into your favorite AI chat to get started immediately.
The prompt
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.
Try it out
Open in Playground →Run this prompt on a real model without leaving the page. Every run is saved to your history for this prompt.
How to use
- 1Copy the prompt as-is — no variables required.
- 2Paste it into ChatGPT, Claude, Gemini, or any capable model.
- 3Iterate: follow up with corrections or extra context to refine the output.