BrowserFrame insert image to html file

how can I insert an image to html.

Hello @Damon.Wang,

If you want to get an image from your web resources, you need to place an image to


and it will be available by “http://localhost:8080/app/VAADIN/my_image.png

Also, you can extend theme and place image to the theme folder and it will be available by
where “hover” is theme folder.

Another way is to use HtmlBox with template content (See documentation). There you can specify relative URL to your images (See sampler programmatically defined templateContents) or use Image component like this:

<htmlBox width="100%" height="100%">
            <div location="image" style="padding: 10px;"></div> </td>
    <image id="image" width="100px" height="100px" scaleMode="CONTAIN">
        <theme path="images/cuba-logo.png"/>

Also, using Image component you can get images from your file storage.


Hi, Roman.
It works. Thanks