WhatsApp Chat Generator (Fake)

About the WhatsApp Chat Generator

Build a conversation message by message, choosing the sender and timestamp for each line, and the bubbles pick up WhatsApp's familiar green and white palette, right down to double-check marks on your own messages. Everything renders locally in your browser tab, and the finished chat exports as a PNG for mockups or memes.

A third, different approach to timestamps among this site's three chat generators

This site's Instagram DM Generator shows no timestamps at all, and its iMessage Chat Generator automatically groups messages under a shared timestamp whenever the time changes. This WhatsApp generator takes a third approach: every single message gets its own individually typed Time field, since real WhatsApp shows a timestamp on every message bubble rather than grouping them. If left blank when adding a message, it falls back to a default of "10:24 PM" rather than leaving the bubble's corner empty.

The double-check mark is a static indicator, not a real read-receipt state

Every message sent as "Me" automatically gets " ✓✓" appended after its timestamp, mimicking WhatsApp's delivery checkmarks. Real WhatsApp actually uses three different states for that indicator — a single gray check for sent, a double gray check for delivered, and a double blue check specifically for read — but this generator always shows the same double checkmark for every outgoing message, with no color distinction and no option to show a different delivery state. It's a simplified visual reference to the real feature, not a faithful reproduction of all three states.

The speech-bubble tail sits at the top corner, not the bottom

Unlike this site's Instagram DM and iMessage bubbles, which flatten their bottom corner to create a tail, WhatsApp's real bubbles have their sharp corner at the top edge nearest to the side they're aligned to — so this generator zeroes out border-top-left-radius for incoming bubbles and border-top-right-radius for outgoing ones. That's a real, deliberate difference in WhatsApp's own bubble design compared to Instagram or iMessage, and matching it is part of what makes this specific mockup look authentic rather than like a generic chat bubble with WhatsApp's colors slapped on.

A reserved margin keeps the timestamp from overlapping the message text

The message text span carries a permanent margin-right: 42px, carving out empty space on the right side of every bubble specifically sized to fit the absolutely-positioned timestamp and checkmark span that sits in the bottom-right corner, outside the normal document flow. Without that reserved margin, a long final line of message text could visually run underneath or collide with the timestamp instead of wrapping cleanly around the space it occupies.

The bubble's inner markup is a safe, empty template — user text never touches innerHTML

Each new message bubble is built by setting innerHTML to a fixed, static two-span skeleton with no content in either span yet, and only afterward are the actual message text and timestamp inserted into those spans using textContent. Since the HTML string being assigned never contains any of your typed message text, there's no way for typed HTML or script-like text to be interpreted as markup — the innerHTML step only ever builds empty structural placeholders.

The phone status bar and "online" label are fixed decoration, not live data

The strip at the top showing "10:24 PM" alongside signal and battery emoji, and the "online" text under the contact name, are both static markup — neither one is tied to your actual device's real time, connection status, or battery level. They exist purely to make the mockup read as a genuine phone screenshot rather than a plain chat widget, matching the same decorative-status-bar approach this site's Instagram Story Generator uses for its own top bar.