The image isn't changing. The background is.

Because the app paints it over a different colour. When a client draws a partially transparent image, it blends each pixel with whatever is behind it. Light themes put white back there. Dark themes put black. For a pixel with straight colour C and alpha a, over a background B, the result is:

out = a·C + (1 − a)·B

Set B = 0 and you get what dark-mode users see: a·C. Set B = 1 and you get what light-mode users see: a·C + 1 − a. Two different outputs, one file, and the file never had to do anything.

Solve two compositing equations at once, per pixel. Say you want dark mode to show image D and light mode to show image L. That's two equations per pixel:

a·C = D            (over black, B = 0)
a·C + 1 - a = L    (over white, B = 1)

Substitute the first into the second and a closed form falls straight out: alpha equals one minus L plus D, and colour equals D divided by alpha.

a = 1 - L + D
C = D / a

Which is a complete answer — with one condition attached. Alpha has to land between 0 and 1, and that only happens when D ≤ L at every single pixel. The dark-mode image must be darker than the light-mode image everywhere. Call it the D ≤ L constraint: it is the entire cost of the technique, and every design decision in a dark-mode illusion generator follows from it. The two methods below pay it in different currencies.

Cite this:Duality, “How dark-mode illusion images work,” https://duality.drummerduck.com/how-it-works#alpha-solve

The direct approach is to force the constraint to hold. Squash the light image up into the top half of the tonal range and the dark image down into the bottom half. Now D ≤ L is guaranteed and the solve is exact at every pixel — no texture, no artefacts, a completely smooth result.

The bill arrives as contrast. Each image only ever gets part of the range, so your light-mode picture can never go properly black and your dark-mode picture can never go properly white. Everything reads a little washed out. The Dark ceiling and Light floor controls in the studio are you deciding how to split that range between them.

Because of how the better method avoids that contrast loss. Instead of asking every pixel to carry both images at half strength, it hands each pixel to one image and lets it go all the way.

A mask splits the canvas into two sets. Light-carrier pixels are asked to show the light image over white and pure black over black — substitute D = 0 and you get a = 1 − L, C = 0. Dark-carrier pixels do the mirror image: show the dark image over black and pure white over white, so L = 1, giving a = D and C = 1.

light carrier ->  a = 1 - L,  C = 0    (dark pixel, partial alpha)
dark  carrier ->  a = D,      C = 1    (white pixel, partial alpha)

Every pixel now keeps the full 0–1 range. The other image's pixels simply read as background — white on white, black on black — and your eye averages them away at normal viewing distance. You lose brightness rather than contrast, which is a much better trade for photographs.

The catch is that the mask is still physically there. Zoom into one of these images and you'll find a fine weave running through it. That texture isn't a filter or a stylistic choice — it's the seam where the two pictures are stitched together.

Any mask works, so the pattern becomes an aesthetic decision. A 1px checkerboard disappears at full size. A 4px halftone is unmistakably deliberate. Scanlines read retro; crosshatch reads like engraving. Push the balance slider off 50/50 and one image gets more pixels than the other — useful, because most of X is on dark mode.

No — either half can be typed text or a flat fill instead of an image. Text is where the technique stops being a curiosity and starts being a joke delivery mechanism: the setup is visible to everyone, and the punchline is reserved for whoever happens to have dark mode on.

• Photo in light, caption in dark
• Caption in light, photo in dark
• Two photos, no text at all
• One photo and a flat fill, so it only shows up in one theme

Yes, but greyscale is the safe setting and here's why. Alpha is a single number shared by all three channels, which means a saturated pixel can't be solved cleanly for both themes at once. Interlace mode handles a light-carrier pixel by setting alpha from the darkestchannel, so any colour above that floor leaks a faint tint into the other theme. It's usually subtle, and it's always proportional to saturation.

That's why the saturation slider defaults to zero. Greyscale leaks nothing at all. Turn it up when the colour is worth a little ghosting, and watch the fidelity readout in the studio — it's measuring exactly this.

Almost always one of three causes, and all three are avoidable:

• X re-encoded your PNG to JPEG.JPEG has no alpha channel, so a re-encode destroys the illusion outright rather than degrading it. X keeps PNGs under about 5 MB — the studio measures the real encoded size and warns you before you cross it.
• You're looking at a timeline thumbnail. Downscaling averages neighbouring pixels, and a 1px mask averages to flat grey. The full-size view is always correct, but if the timeline preview matters to you, use a larger cell size.
• The viewer is on X's Dim theme. The maths assumes pure white and pure black. Dim is neither, so both images show through faintly at once. The studio previews Dim, Slack and iOS surfaces so you can check before posting.

Slack, Discord, iMessage, Notion and any web browser all preserve the effect. Instagram never will — it re-encodes everything to JPEG. The full table is on where it works.

The illusion lives or dies on tone, and most images need a nudge before they survive both backgrounds. So the controls that matter are all exposed rather than hidden behind a single “generate” button.