Watermark and attribution
Understand the default RVE watermark and the attribution rules for each SDK plan
RVE SDK adds the RVE watermark to video exports by default. The watermark is the top layer, so it appears above all other content.
Licence rules
Your SDK plan determines if you can remove or replace the RVE watermark:
- Hobby: For non-commercial use only. You must keep the default RVE watermark on all exports. Do not remove, replace, hide, or obscure it.
- Commercial: For commercial products and client work. You can remove the RVE watermark or replace it with your own watermark.
- Enterprise: Your agreement defines your attribution rules. Unless your agreement says otherwise, you can remove or replace the RVE watermark.
The SDK makes the watermark prop available for product configuration. This technical option does not change the terms of your licence. See the RVE SDK plans if you need commercial use or watermark-free exports.
Quick Start
import { ReactVideoEditor } from '@reactvideoeditor/react-video-editor/react-video-editor';
// Default watermark (RVE badge)
<ReactVideoEditor projectId="my-project" />
// Custom watermark (Commercial and Enterprise plans)
<ReactVideoEditor
projectId="my-project"
watermark={{ src: '/your-logo.png' }}
/>
// No watermark (Commercial and Enterprise plans)
<ReactVideoEditor projectId="my-project" watermark={false} />Configuration
The watermark prop accepts three value shapes:
Default Watermark
Pass true (or omit the prop) to render the built-in RVE logo and text badge in the bottom-right corner. The badge scales automatically to look consistent across aspect ratios (16:9, 1:1, 9:16, etc.).
<ReactVideoEditor projectId="my-project" watermark={true} />Custom Watermark
Commercial and Enterprise customers can pass an object with a src to use their own image. Optional fields control the position, size, and opacity.
<ReactVideoEditor
projectId="my-project"
watermark={{
src: '/your-logo.png',
position: 'bottom-right',
opacity: 0.5,
scale: 1,
padding: 20,
}}
/>| Field | Type | Default | Description |
|---|---|---|---|
src* | string | — | Path or URL to the watermark image |
position | WatermarkPosition | 'bottom-right' | Corner placement — 'top-left', 'top-right', 'bottom-left', or 'bottom-right' |
opacity | number | 0.5 | Opacity from 0 (invisible) to 1 (fully opaque) |
scale | number | 1 | Scale multiplier for the watermark size |
padding | number | 20 | Pixel padding from the edge of the video |
No Watermark
Commercial and Enterprise customers can pass false for an export with no watermark.
<ReactVideoEditor projectId="my-project" watermark={false} />Conditional Watermarks
Commercial and Enterprise customers can use the watermark in their own product plans. For example, you can keep a watermark on free exports and remove it for paid users:
import { ReactVideoEditor } from '@reactvideoeditor/react-video-editor/react-video-editor';
function VideoEditor({ user }) {
return (
<ReactVideoEditor
projectId="my-project"
watermark={user.plan === 'free'
? { src: '/your-logo.png' }
: false
}
/>
);
}Freemium Example
Commercial and Enterprise customers can combine the watermark with feature overrides. This example adds a watermark to free exports and adds upgrade prompts to premium features:
import { ReactVideoEditor } from '@reactvideoeditor/react-video-editor/react-video-editor';
import { ActionId } from '@reactvideoeditor/react-video-editor/types';
function VideoEditor({ user }) {
const isFree = user.plan === 'free';
return (
<ReactVideoEditor
projectId="my-project"
watermark={isFree ? { src: '/your-logo.png' } : false}
featureOverrides={isFree ? {
[ActionId.GENERATE_CAPTIONS]: {
badge: 'PRO',
onUpgrade: () => showUpgradeModal(),
},
} : undefined}
/>
);
}Type Reference
type WatermarkPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
type WatermarkConfig =
| boolean
| {
src: string;
position?: WatermarkPosition;
opacity?: number;
scale?: number;
padding?: number;
};