Text and Titles
Learn how to add text and titles to your videos in detail. Take advantage of 16+ fonts, color options, outlines, drop shadows, and other styling features.
Text Feature Overview
VideoBuff's text feature lets you add rich text overlays on top of your video. Over 16 fonts are available, including Japanese fonts, supporting various use cases like captions, subtitles, and titles.
Text clips are handled on the timeline just like any other clip, so you can freely adjust when they appear and how long they last. With extensive styling options including font size, color, background, outline, and drop shadow, you can easily create professional-looking text.
Adding Text
To add text, first create a text track. Select a text track from the '+' button in the track header, or use the add-text button in the toolbar.
Once a text clip is placed on the timeline, enter your text content in the inspector panel. Adjust the clip length by dragging to control how long the text is displayed.
You can place multiple text clips on the same or different tracks to show different text at different times.
Font and Styling
Choose from Japanese fonts such as Noto Sans JP, Zen Kaku Gothic New, and M PLUS Rounded 1c, as well as Latin fonts like Inter, Roboto, and Montserrat. Font size ranges from 12px to 200px, covering everything from small captions to large titles.
Bold and italic toggles are available, and text alignment can be set to left, center, or right. You can also adjust line height and letter spacing to achieve readable and well-designed text.
Colors and Effects
Text color can be freely set with the color picker, including semi-transparent values. Setting a background color with an alpha value lets you create caption-style text with a colored band.
Outline (stroke) has independent color and width settings to ensure text visibility even over complex video backgrounds. Drop shadow allows you to adjust color, blur amount, and X/Y offset, adding depth and readability to your text.
Combining these effects enables everything from variety-show-style captions to simple subtitles.
Positioning Text
Text position is specified with X and Y coordinates using normalized values from 0 to 1, where 0.5 represents the center. This allows resolution-independent positioning regardless of the export resolution.
Use the sliders in the inspector panel or enter numeric values directly for precise placement. Text position is independent of the timeline playhead, so it remains in the same position throughout the clip's duration.
You can place titles at the top center, captions at the bottom, or any other arrangement that suits your project.
Technical Note: Text Rendering
Text rendering uses the Canvas 2D API. Fonts are preloaded from Google Fonts to prevent font substitution or rendering issues during display.
The same Canvas 2D text rendering pipeline is used during export, ensuring preview and export output match exactly. Outlines are implemented via the strokeText method, and drop shadows use the Canvas shadow API, both leveraging the browser's GPU acceleration for fast rendering.