How to create a WhatsApp call log mockup in four steps
- Leave the header as Calls. The page opens with the header already set to
Calls, which is the real tab name — change it only if the scene genuinely needs something else. - List the callers. Each participant becomes one row in the log: a name and an avatar apiece. Between three and six entries is the range where a call log looks naturally used rather than padded.
- Set each call. A row takes a caller, a direction — Outgoing, Incoming or Missed — and a time, plus an optional duration like
12 min. Real logs mix directions and lengths, and one or two red missed entries are what sell it. - Export. Pick 2x for screens and 3x if the log will be printed, then download. Phone frame begins off, giving you the flat rectangle a real capture produces; switch it on when you want the log framed inside a handset for a device mockup.
What makes a WhatsApp call log actually look real
The Calls screen shares a colour system with the chat view but a completely different structure — it is a list, not a conversation, and generators that render it as chat bubbles with a phone icon are getting it wrong. Here is what ChatMock reproduces:
| Element | Detail |
|---|---|
| Direction arrows | Green up-right = outgoing, green down-left = incoming, red down-left = missed (#ea4335) |
| Missed calls | Caller name renders in the same red as the arrow, exactly like the real app |
| Row layout | 46px avatar, bold name, direction + time on the second line, green phone icon on the right |
| Bottom tab bar | Status / Calls / Chats / Communities / Settings, with Calls highlighted in green (#00a884) |
| Durations | Optional small grey text under the direction line for completed calls |
Two details separate a convincing call log from a fake. First, the arrow grammar: real users read those arrows without thinking, and a log where every call points the same direction looks staged — real usage mixes incoming, outgoing and the occasional missed call. Second, the tab bar: the Calls screen is never shown without the bottom navigation in a genuine screenshot. Cropping it off is the normal workaround for generators that cannot render it.
Everything you can customise
- Caller names and avatar photos
- Unlimited call entries, reorderable, any caller
- Direction per call: outgoing, incoming or missed — plus a Video toggle for camera-call entries
- Time per call, plus optional duration notes
- Light or dark mode
- Status bar: clock, battery and signal
- Optional phone frame
What people use call log mockups for
The Calls screen appears in storytelling where the evidence is who called whom and when: a missing-person scene, a “they called me 14 times” story beat, an HR or safeguarding training module, or a comedy sketch about ignoring calls. The information density of a call log — names, directions, times — is what makes it useful on screen, and also why getting the arrow grammar wrong is so visible.
Intent is what decides, just as it does on every page of this site. Call logs composed to illustrate, to parody, to teach or to design are fine; a fabricated log used to deceive someone, to harass a person, to impersonate them, or to manufacture evidence is not acceptable, and this page will not become a bank, government, medical or legal notice factory. The Acceptable Use Policy spells out the boundary.
Local rendering, offline-proof
Caller names, numbers, directions and durations are laid out with plain HTML and CSS inside your browser, and the PNG is generated on your own device before the download starts. No row of the log is sent anywhere or kept on a server, so you can disconnect after the page loads and keep editing.
Other generators
For conversations rather than calls, the WhatsApp chat generator covers one-to-one threads with blue ticks and dark mode, and the group chat generator handles multi-participant chats. The Android SMS generator is the closest cousin to this page in spirit — another list-style screen rather than a bubble thread — and the examples gallery shows the whole set at once.
Frequently asked questions
Is the WhatsApp call log generator free?
It is, and there is nothing to sign up for — no account, no email gate, no limit and no watermark on the PNG you export.
What do the arrows beside each call mean?
They mirror the real app's direction grammar: a green arrow pointing up-right is an outgoing call, a green arrow pointing down-left is one you received, and a red arrow marks a missed call. Missed calls also turn the caller's name red, just as WhatsApp does.
Can I give a call a duration?
Yes — each row takes an optional duration note such as 12 min, printed as small grey text under the direction line. Genuine logs show a duration for completed calls, so including a couple makes the list feel lived-in.
Is the bottom tab bar included?
Always. The Calls screen renders with its full five-tab navigation — Status, Calls, Chats, Communities, Settings — with Calls highlighted in green, the same arrangement as the real app. A screenshot with the bar cropped off reads as a crop rather than a capture.
Should the phone frame be on?
It starts off, so the export looks like a plain screen capture the way a real one does; enable Phone frame only when the log is going into a device-mockup composite. That default keeps the image honest unless you ask for the handset outline.
What kind of data fills a believable call log?
A convincing log mixes directions — a few outgoing, a couple incoming and the occasional missed call — plus short and long durations and times spread across the day. A list where every row points the same way looks staged, so vary them.
Is my data uploaded to a server?
Nothing leaves your device. The log is rendered in your browser and the PNG is generated there too before it is saved, so names, numbers and durations stay put. You can go offline after loading the page and the editor carries on.
Can I use the call log mockups commercially?
For legitimate work — videos, presentations, training material, fiction, design — yes. Using a fabricated log to deceive someone, impersonate a person or fabricate evidence is not acceptable, and the Acceptable Use Policy has the full boundary.