We recommend that you familiarize yourselves with UI Customization Concepts before attempting to modify any components.
VeltCommentPinWireframe

- React / Next.js
- Other Frameworks
GhostCommentIndicator

- React / Next.js
- Other Frameworks
Index

- React / Next.js
- Other Frameworks
Number
The annotation number displays on comment pins, providing a persistent identifier for each comment that remains constant across sessions. This number makes it easy to reference specific comments in team discussions or documentation.- React / Next.js
- Other Frameworks
PrivateCommentIndicator

- React / Next.js
- Other Frameworks
Triangle

- React / Next.js
- Other Frameworks
UnreadCommentIndicator

- React / Next.js
- Other Frameworks
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.
true
- React / Next.js
- Other Frameworks
Using Props:Using API:
Dark Mode


Default: false
- React / Next.js
- Other Frameworks
Using Props:Using API:
Variants
- Define variants for the
Velt Comment Pin
component. This is useful for customizing how the pin looks on different elements like charts, tables, etc. - Learn more about how to define and use variants here.
- React / Next.js
- Other Frameworks