Make the logo file at the pixel size of the box it will fill on the panel's own screen resolution; a file at twice the box size also works, because the editor halves it cleanly. Save a static logo as BMP, WMF, JPG or JPEG, and use BMP when it appears on a button or animated object. Changing the file format never changes the size on screen.
Putting a logo on an HMI panel raises two questions at once: how many pixels the file should have, and what format to save it in. The two have separate answers, and mixing them up wastes hours. The pixel count follows the box you draw for the logo inside that panel's own screen resolution. The format follows the object that shows it: BMP, WMF, JPG or JPEG for a static image, BMP when the logo sits on a button or an animated object. There is no set logo resolution an HMI requires. This article gives the sizing rule, a worked example and the steps.
The answer: size the file to its box, save the format the object needs
There is no set logo resolution to hit. Each panel model has its own screen resolution, printed on that model's product page, and the logo only has to fit the space you give it inside that canvas.
So the sizing rule is: draw the box first, make the file second. Read the box's width and height in pixels from your project, then prepare the artwork at exactly those dimensions, or at exactly twice them. Scaling down is the safe direction, and it is the documented one: a 90 × 90 px logo has been used and scaled down to fit the area available on the screen. At exactly half scale, every 2 × 2 block of source pixels merges into one clean target pixel. The direction to avoid is a file smaller than its box, because the panel then enlarges the artwork and enlargement invents pixels, so thin strokes go soft.
The format rule is separate. A plain static image takes BMP, WMF, JPG or JPEG. When the same artwork appears on a button, a dynamic object, a multi-state indicator or an animation, that copy is documented to use BMP.
Because size and format are separate checks, converting a file between accepted formats never fixes a size problem. A logo that lands too large in its box needs new pixel dimensions, not a different extension.
Recommendation: Make the logo file at exactly the pixel size of its box on that panel's screen resolution, or at exactly twice that size so the software halves it cleanly. Save a plain static logo as BMP, WMF, JPG or JPEG, and save BMP whenever the artwork appears on a button, multi-state or animated object. Keep the original artwork file untouched until the panel itself shows the result.
What you need
- The panel model designation, read from the label on the panel or from the device settings in your project.
- That model's screen resolution from its own product page. Resolutions are not interchangeable between models: common 4.3-inch panels run 480 × 272 px and common 7-inch panels run 800 × 480 px.
- The logo artwork, in whatever format your graphics editor saves.
- The graphic or image object your HMI software uses for static pictures. Its name and menu location differ between software packages, so take the click-path from the manual for the version installed on your PC. The sizing rule and the format list here are the same whatever the software.
Worked example: sizing a 90 × 90 px logo for a 480 × 272 panel
Inputs
- Source file: 90 × 90 px, 24-bit color. This is the size this article's example carries; any size works as long as it is not smaller than the box.
- Panel: 480 × 272 px, the screen resolution common on 4.3-inch HMI panels.
- Logo box: 45 × 45 px, drawn in the top-left corner of the layout. Your box comes from your own layout; this one is chosen as the half-size target.
The rule in words
Scale factor equals box size divided by file size, per axis. The file must be at least the box in both directions, and an exact integer ratio, half or a third, keeps edges clean because whole blocks of source pixels merge into each target pixel.
Arithmetic
- Scale: 45 ÷ 90 = 0.5 exactly, so every 2 × 2 block of source pixels becomes one target pixel and diagonal strokes stay smooth.
- Screen share: 45 ÷ 272 = 0.165, about 17% of the screen height; 45 ÷ 480 = 0.094, about 9% of the width.
- File size: 90 × 90 = 8,100 pixels; 8,100 × 3 bytes per pixel = 24,300 bytes, about 24 KB of pixel data for the 24-bit BMP.
Result
A 90 × 90 px file lands in a 45 × 45 px box at exactly half size, and it uses about 24 KB of project space.
Decision
Keep the 90 × 90 file for a 45 × 45 box. The threshold to act on is the box size. If the layout gives the logo 60 × 60 px, remake the source at 120 × 120 px, because 120 ÷ 2 = 60 keeps the same clean 2:1 step, and that file uses 120 × 120 × 3 = 43,200 bytes, about 43 KB. Squeezing the 90 × 90 file to 60 × 60 instead maps three source pixels to two, and a one-pixel stroke can land on the wrong side of the merge. If the box is bigger than the file, remake the artwork larger; enlargement is the direction that always loses quality.
Putting the logo on the screen
- Read the model designation from the panel label or the project's device settings, and open that model's product page for its screen resolution.
- In the project, draw or note the box where the logo will sit, and write down its width and height in pixels.
- Prepare the logo file at exactly the box size, or at exactly twice the box size. The worked example above shows why the half-size step matters.
- Save the working copy as BMP, WMF, JPG or JPEG. Save BMP if the artwork will appear on a button, a multi-state object or an animation. Leave the original artwork untouched until the panel shows the result.
- Insert the file with your software's graphic or image object, following the manual for the version installed on your PC.
- Compile and transfer the project to the target panel the way you normally do.
If the artwork already lives on an existing screen you want to reuse, exporting an HMI display to JPG or BMP image files pulls it out at its drawn size, ready to re-check against the new panel's resolution.
How to check it worked
Look at the panel from the operator's normal working position and run three checks.
- The logo appears where the object sits. If the import step refused the file and you see a red X where the logo belongs, the fix for an HMI bitmap import red X walks the file checks in order.
- The logo fills its box edge to edge, with no cropping and no blank margin. Oversize or undersize means the file's pixels and the box disagree; go back to step 3. Converting the format changes nothing on screen.
- The strokes are legible. Soft edges mean the file was smaller than its box and the panel enlarged it; remake the source at the box size.
Two points sit outside the logo itself. Zooming the editor canvas changes only what you see on the PC, not what the panel shows; why HMI editor zoom does not change panel resolution covers that distinction. And a logo like this example, about 24 KB as a BMP, takes a trivial share of the project's image space; bitmap memory only becomes a design limit when screens carry many large photographs, which fitting product images when HMI bitmap memory runs out works through.
When it is the size, and when it is the format
| What you see | What it points to | What to do |
|---|---|---|
| Import refuses the file | Wrong format or a bad export | Confirm the saved format is BMP, WMF, JPG or JPEG and export a fresh copy |
| Logo too large or too small for its box | File pixels and box pixels disagree | Resize the file to the box size; a format change does nothing here |
| Sharp in the editor, soft on the panel | File smaller than the box, panel enlarging | Remake the source at the box size or at twice it |
| Fits one panel, not another | Each model has its own screen resolution | Check each model's product page, and re-check after any project moves panels |
The last row matters when a project moves between panels. Some HMI software documents that it rescales a bitmap so the image keeps its physical size on the new screen, which means its pixel size changes with the new resolution. Re-check the logo's box against the new panel's resolution before you transfer.
Questions
Can I use a PNG file for the HMI logo?
The formats documented for this job are BMP, WMF, JPG and JPEG, and PNG is not on that list. Keep the PNG as your master artwork and export a BMP or JPG copy sized to the logo box. A flat-color logo survives JPG compression well; choose BMP when the image will sit on a button or an animated object.
Does a smaller file make the logo smaller on screen?
No. The box you draw in the project decides the display size, in the panel's pixels. The 90 × 90 px file in the example is about 24 KB as a 24-bit BMP, and the same artwork as a JPG is typically a fraction of that on disk, but it fills the same box either way. Format conversion changes disk space, never screen size.
Why does the logo look sharp in the editor but soft on the panel?
Softness means enlargement. If the file has fewer pixels than the box, the panel has to invent pixels to fill it, and thin strokes blur. Remake the source at the box's exact pixel size, or at twice the box size so the editor halves it cleanly. Detail the file never had cannot be recovered on the panel.
Can the same logo file work on two different panel models?
Yes, if both show it at the same pixel size. Look up each model's screen resolution on its own product page, because resolutions are not interchangeable between models. When a project moves to a different panel, some HMI software rescales bitmaps to keep their physical size, so re-check the logo's pixel box on the new resolution before transferring.
Planning information, not legal or engineering advice. Rules differ by place: check codes and permits with your local authority and your licensed trades.