Place content into TV and monitor screen frames for living room and presentation previews.
This tool takes one image - a dashboard, landing page, poster, or app screenshot - and sets it into a TV or monitor from a frame library: living room sets on walls or stands, and desk displays for presentation previews. You choose the frame, the image goes into its screen area, and the finished scene exports as a single picture. What most users find unexpected: the export is the whole scene, not their image alone - the room and the bezel surround the content, so text and fine detail look far smaller than they do full-screen. Everything runs in the browser; nothing you upload leaves your machine.
A concrete input and expected output from the current implementation.
Input
Upload dashboard.png (1920 x 1080) and choose a living room TV frame.
Expected output
A single PNG of the living room scene with dashboard.png displayed on the TV screen, the frame and room rendered around the content.
The tool composites the uploaded image into the screen area of the chosen frame and exports the full scene as one image, so the output contains the room and the content together, not the content alone.
Each frame is a complete scene - the room or desk, the device, and its bezel - with the screen as a fixed region inside it. The uploaded image is fitted into that region, so how your content looks depends on how your image's shape compares with the screen's shape. Keep the image's aspect ratio close to the screen's if you want the whole image to appear the way you composed it.
Rendering happens in the browser: the image is drawn into the scene locally and the finished composite is exported as a single image file you can download and reuse. Nothing is uploaded to a server, so mockups of client work stay on your machine. Because the screen occupies only part of the scene, compose the picture as a room shot - your content is an element inside it, not the whole image.
No. The tool takes a still image and returns a still image, so a motion clip cannot be embedded. To fake the effect, export a representative frame of the video and place that. If the deliverable must show moving content, a static mockup is the wrong instrument.
Use the largest, cleanest version you have; a small or heavily compressed file limits how crisp the result can be. Keep the aspect ratio close to the screen's if you want the whole image visible, and prefer PNG over heavy JPEG so compression artifacts do not show on a large display.
The example and behavioral notes were checked against the browser implementation. Standards and primary references below define the relevant format, formula, or platform behavior.
Pick colors visually and convert between HEX, RGB, HSL, and CMYK formats.
Preview how screen colors translate to print with CMYK simulation and proofing.
Preview any Google Font at various sizes, weights, and with custom sample text.
Create linear, radial, and conic CSS gradients with a visual editor and code output.
Generate harmonious color palettes from a base color using color theory rules.
Simulate how colors appear to people with various types of color vision deficiency.