Sampled from 6 of 横浜市避難ナビ's App Store screenshots — background, accent and theme, measured by LaunchShots (not something Apple publishes).
#FCFCFC bg
#DDDDDD
#0474BC accent
#111111 text
Reading the caption text from the screenshots in your browser…
「横浜市避難ナビ」は横浜市が提供する防災アプリです。 災害時の避難行動を平時から災害時まで一体的に支援します。 ・浸水状況をAR機能による疑似体験することができます。 ・ハザードマップや避難場所等の確認することができます。 ・風水害時に一人ひとりの避難行動計画であるマイ・タイムラインを作成することができます。 ・災害時には、避難情報を作成したマイ・タイムラインと連動して通知されるとともに、避難場所の開設状況等を確認することができます。 ・「横浜市避難ナビ」は、横浜市内だけではなく全国各地で利用できます。 【主な機能】 ・浸水状況をAR機能による疑似体験 ・現在地周辺の避難所等の自動検索 ・土砂災害警戒区域、浸水想定区域などのハザードマップ表示 ・現在地の防災情報や危険性情報の表示 ・マイ・タイムラインの作成機能 ・ARカメラ機能、避難コンパス機能 ・オフライン機能 ・災害時における避難情報をプッシュ通知 ・災害時における避難場所の開設状況等の確認 ・安否登録、安否確認 ・防災学習コンテンツ
Every shipping app on the App Store has gone through the same decisions you're working through right now: which screenshot goes first, what caption sits over it, which device frame to show, what color the background should be. The 10 screenshots above are 横浜市避難ナビ's answers to those questions — they're public, they're real, and they made it through Apple's review.
What the numbers say: 横浜市避難ナビ runs a light set with one background colour (#FCFCFC) carried across every screenshot — the listing reads as a single poster when the shots sit side by side in search results. The accent colour we picked up, #0474BC, is the one to reuse for badges, arrows and highlighted words if you borrow this look. Hit Use this style to open the editor with these exact colours and drop your own screenshot in.
Notice the first screenshot in particular. It's the one users see in search results and on the product page, and it's where most apps spend their best caption and tightest design. Look at the proportion of background to phone, where the text sits, what one thing the image is trying to communicate.
Want to see how other Weather apps approach the same problem? Browse more Weather apps in the showcase.
Open LaunchShots and design your App Store & Google Play screenshots — pick a device frame, drop captions, ship in minutes. Free, in your browser.
Open the screenshot editor →Closest background + accent colours among the listings we've analysed — useful when you want to see the same palette handled by a different team.