Concepts
Async Collaboration
Realtime Collaboration
Recorder
Recorder Tool
The button to add new recordings.
We recommend that you familiarize yourselves with UI Customization Concepts before attempting to modify any components.
VeltRecorderAllToolWireframe
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolWireframe>
{/* ... Add your content here */}
</VeltRecorderAllToolWireframe>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolWireframe>
{/* ... Add your content here */}
</VeltRecorderAllToolWireframe>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-recorder-all-tool-wireframe>
<!-- ... Add your content here -->
</velt-recorder-all-tool-wireframe>
</velt-wireframe>
VeltRecorderAllToolMenuWireframe
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolMenuWireframe>
<VeltRecorderAllToolMenuWireframe.Audio>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Audio>
<VeltRecorderAllToolMenuWireframe.Video>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Video>
<VeltRecorderAllToolMenuWireframe.Screen>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Screen>
</VeltRecorderAllToolMenuWireframe>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolMenuWireframe>
<VeltRecorderAllToolMenuWireframe.Audio>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Audio>
<VeltRecorderAllToolMenuWireframe.Video>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Video>
<VeltRecorderAllToolMenuWireframe.Screen>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Screen>
</VeltRecorderAllToolMenuWireframe>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-recorder-all-tool-menu-wireframe>
<velt-recorder-all-tool-menu-audio-wireframe>
<!-- ... Add your content here -->
</velt-recorder-all-tool-menu-audio-wireframe>
<velt-recorder-all-tool-menu-video-wireframe>
<!-- ... Add your content here -->
</velt-recorder-all-tool-menu-video-wireframe>
<velt-recorder-all-tool-menu-screen-wireframe>
<!-- ... Add your content here -->
</velt-recorder-all-tool-menu-screen-wireframe>
</velt-recorder-all-tool-menu-wireframe>
</velt-wireframe>
Audio
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolMenuWireframe.Audio>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Audio>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolMenuWireframe.Audio>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Audio>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-recorder-all-tool-menu-audio-wireframe>
<!-- ... Add your content here -->
</velt-recorder-all-tool-menu-audio-wireframe>
</velt-wireframe>
Video
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolMenuWireframe.Video>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Video>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolMenuWireframe.Video>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Video>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-recorder-all-tool-menu-video-wireframe>
<!-- ... Add your content here -->
</velt-recorder-all-tool-menu-video-wireframe>
</velt-wireframe>
Screen
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolMenuWireframe.Screen>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Screen>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAllToolMenuWireframe.Screen>
{/* ... Add your content here */}
</VeltRecorderAllToolMenuWireframe.Screen>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-recorder-all-tool-menu-screen-wireframe>
<!-- ... Add your content here -->
</velt-recorder-all-tool-menu-screen-wireframe>
</velt-wireframe>
VeltRecorderAudioToolWireframe
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAudioToolWireframe>
{/* ... Add your content here */}
</VeltRecorderAudioToolWireframe>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltRecorderAudioToolWireframe>
{/* ... Add your content here */}
</VeltRecorderAudioToolWireframe>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-recorder-audio-tool-wireframe>
<!-- ... Add your content here -->
</velt-recorder-audio-tool-wireframe>
</velt-wireframe>
VeltRecorderVideoToolWireframe
Copy
Ask AI
<VeltWireframe>
<VeltRecorderVideoToolWireframe>
{/* ... Add your content here */}
</VeltRecorderVideoToolWireframe>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltRecorderVideoToolWireframe>
{/* ... Add your content here */}
</VeltRecorderVideoToolWireframe>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-recorder-video-tool-wireframe>
<!-- ... Add your content here -->
</velt-recorder-video-tool-wireframe>
</velt-wireframe>
VeltRecorderScreenToolWireframe
Copy
Ask AI
<VeltWireframe>
<VeltRecorderScreenToolWireframe>
{/* ... Add your content here */}
</VeltRecorderScreenToolWireframe>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltRecorderScreenToolWireframe>
{/* ... Add your content here */}
</VeltRecorderScreenToolWireframe>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-recorder-screen-tool-wireframe>
<!-- ... Add your content here -->
</velt-recorder-screen-tool-wireframe>
</velt-wireframe>
Styling
Disable ShadowDOM
- By default, ShadowDOM is used to ensure that your app’s CSS does not interfere with the styling of the SDK components.
- Disable the shadow dom to apply your custom CSS to the component.
Default: true
Copy
Ask AI
<VeltRecorderTool shadowDom={false} />
Copy
Ask AI
<VeltRecorderTool shadowDom={false} />
Copy
Ask AI
<velt-recorder-tool shadow-dom="false"></velt-recorder-tool>
Dark Mode
Default: false
Copy
Ask AI
<VeltRecorderTool darkMode={true} />
Copy
Ask AI
<VeltRecorderTool darkMode={true} />
Copy
Ask AI
<velt-recorder-tool dark-mode="true"></velt-recorder-tool>
Was this page helpful?
Assistant
Responses are generated using AI and may contain mistakes.