how to add watermark to images in robohelp

Here is one possible approach.

First, wrap your <img> in a <figure> container and give the <figure> a class like "watermark":

<figure class="watermark">
  <img src="my-image.jpg" alt="my image" />
</figure>

In your CSS file, create two classes: One for the figure, and one for the watermark text to add over the image:

figure.watermark {
   display: block;
}

figure.watermark:before {
   color: #000000;
   content: "© COPYRIGHT BY COMPANY";
   font-family: "Arial";
   font-size: 20pt;
   text-align: center;
   font-weight: bold;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   position: absolute;
   z-index: 1;
   opacity: 0.5;
}

The result looks like this:

You can tweak how the watermark text is displayed in the CSS.

From now on, if you insert an image without a figure caption, you can just wrap it in a figure element with a class "watermark," like shown in the code example above. If you insert an image with a figure caption (the text field at the bottom of the insert image dialog), RoboHelp wraps the image in figure automatically, and then you can select the figure in the breadcrumbs bar at the top and assign the style to it.

Note, that this is just a quick draft, so you might want to tweak the CSS to be more advanced and responsiv (like automatic font-size change depending on image size, etc.).

I don't believe so - you'd normally do that in your image editing software and then bring the image into your RH topic.