Pass parameters with --set key=value, once per parameter. Every parameter has a default, so node bin/titlekit.mjs build TEMPLATE works with no --set at all.
| Type | Accepted | Example |
|---|---|---|
| string | any text, also empty | --set "name=Grace Hopper", --set prefix= |
| number | a decimal number | --set hold=4.5 |
| color | #rrggbb |
--set accent=#ef4444 |
background also accepts none. safeSide, safeTop and safeBottom also accept auto, which picks the format default. Put quotes around the whole pair when the value has spaces. Unknown keys and malformed values stop the build with one sentence that names the parameter.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
background |
color | none |
Hex color for a full frame solid, or none for a transparent render. |
safeSide |
number | auto |
Side margin in px. auto is 64 for 9x16 and 96 for 16x9. |
safeTop |
number | auto |
Top margin in px. auto is 220 for 9x16 and 80 for 16x9. |
safeBottom |
number | auto |
Bottom margin in px. auto is 420 for 9x16 and 96 for 16x9. |
All templates run at 30 fps. Composition names are TEMPLATE 16x9 (1920x1080) and TEMPLATE 9x16 (1080x1920).
Parameters with a fixed list of values name them in the Type column. Any other value stops the build. Lists such as chapters, labels, values and colors are split with the pipe character.
The transitions shape-wipe and circle-wipe cover the whole frame and ignore the safe area. The element template places files from assets/elements, see that folder for credits and license.
Up to eight bars grow from a baseline, values count up and the largest bar takes the accent. Default length 4.4 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
title |
string | Views per day |
Heading above the chart. Empty for none. |
labels |
string | Mon|Tue|Wed|Thu|Fri |
Bar labels split with the pipe character. |
values |
string | 12|19|8|24|16 |
Bar values split with the pipe character, same count as labels. |
suffix |
string | k |
Text after each value. |
accent |
color | #22c55e |
Color of the largest bar. |
barColor |
color | #64748b |
Color of the other bars. |
textColor |
color | #ffffff |
Color of the title, values and labels. |
hold |
number | 2.5 |
Seconds the finished chart stays. |
textSize |
number | 40 |
Size of values and labels in px. The title is 1.6 times this. |
Short form captions in groups of words, with a box that jumps to the spoken word. Default length 4.3 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
text |
string | This is how you make captions that people actually read |
The spoken sentence. Split into groups of up to maxWords words. |
maxWords |
number | 3 |
Most words shown at once. |
wordsPerSecond |
number | 2.6 |
Speaking rate. Each word is highlighted for 1 / wordsPerSecond seconds. |
accent |
color | #7c3aed |
Color of the box behind the spoken word. |
textColor |
color | #ffffff |
Color of the words. |
uppercase |
string, one of yes, no |
yes |
yes sets the words in capitals, no keeps the original case. |
textSize |
number | 84 |
Font size in px. Shrinks so every group fits the safe width. |
A transition: circles grow from the center to cover the frame, then open from the middle. Default length 1.2 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
colors |
string | #22d3ee|#0f172a |
Circle colors split with the pipe character, back to front. The last one covers the cut. |
stagger |
number | 0.08 |
Seconds between one circle and the next. |
travel |
number | 0.45 |
Seconds a circle takes to close or to open. |
A number that counts up with ease out, then a label underneath. Default length 4.5 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
from |
number | 0 |
Start value. |
to |
number | 312 |
End value. |
prefix |
string | + |
Text before the number. |
suffix |
string | % |
Text after the number. |
label |
string | watch time in 30 days |
Line under the number, fades in after the count. |
accent |
color | #22c55e |
Color of the rule between number and label. |
textColor |
color | #ffffff |
Color of the number and the label. |
countSeconds |
number | 1.5 |
Duration of the count in seconds. |
textSize |
number | 220 |
Font size of the number in px. Shrinks to fit the safe area. |
A rounded button that pops in, pulses twice and fades out. Default length 3.6 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
label |
string | Order now |
Button text, set in Inter SemiBold. |
fill |
color | #22c55e |
Button color. |
textColor |
color | #ffffff |
Label color. |
radius |
number | 999 |
Corner radius in px. Values above half the height give a pill. |
textSize |
number | 64 |
Label size in px. Shrinks if the button would leave the safe area. |
Places one of the bundled Lottie elements (confetti, like and subscribe, hearts, bell and more). Default length 7.1 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
element |
string, one of confetti-wide, confetti-tall, success-check, streamers, like-subscribe, subscribe-toggle, floating-hearts, heart-pop, bell, swipe-up, flame, burst, check-circle, sparkles |
like-subscribe |
Which element to place. Run titlekit elements for the list with authors. |
placement |
string, one of center, top, bottom |
center |
Vertical place inside the safe area. Full frame elements always fill the frame. |
size |
number | auto |
Longest side in px. auto picks a size that suits the element. |
delay |
number | 0 |
Seconds before the element starts. |
loops |
number | 1 |
How many times the element plays back to back. |
An uppercase title that glitches in with an RGB split, flickers mid hold and glitches out. Default length 3.2 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
text |
string | Signal lost |
Title text, set uppercase in Inter Bold. |
textColor |
color | #ffffff |
Color of the title. |
splitA |
color | #ff2d55 |
First color of the RGB split. |
splitB |
color | #00e5ff |
Second color of the RGB split. |
hold |
number | 2 |
Seconds between the intro glitch and the outro glitch. |
seed |
number | 7 |
Changes the random glitch pattern. The same seed always gives the same result. |
textSize |
number | 170 |
Font size in px. Shrinks to fit the safe area. |
Up to three uppercase lines that pop in, with a highlight bar under one word. Default length 3.2 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
text |
string | Three edits|that save you|hours |
Title text. Split lines with the pipe character, at most three. |
highlightWord |
string | hours |
Word that gets the highlight bar. Empty for none. |
accent |
color | #facc15 |
Color of the highlight bar. |
textColor |
color | #ffffff |
Color of the title. |
textSize |
number | 120 |
Font size in px. Lines shrink together if the widest one would leave the safe area. |
One sentence, word by word, wrapped to the safe area with one accent word. Default length 3.5 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
text |
string | Clean titles do not need expensive plugins |
The sentence. Words wrap onto lines that fit the safe area. |
accentWord |
string | plugins |
Word drawn in the accent color. Empty for none. |
accent |
color | #22d3ee |
Color of the accent word. |
textColor |
color | #ffffff |
Color of the other words. |
wordDelay |
number | 0.12 |
Seconds between the start of one word and the next. |
textSize |
number | 96 |
Font size in px. Shrinks if the sentence does not fit the safe area. |
Letters rise out of a blur one after another, one word in the accent color. Default length 3.1 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
text |
string | Make it|unforgettable |
Title text. Split lines with the pipe character, at most three. |
accentWord |
string | unforgettable |
Word drawn in the accent color. Empty for none. |
accent |
color | #f472b6 |
Color of the accent word. |
textColor |
color | #ffffff |
Color of the other words. |
hold |
number | 1.5 |
Seconds the full title stays before it blurs out. |
textSize |
number | 160 |
Font size in px. Lines shrink together to fit the safe area. |
Name and role with an accent bar, for interviews and speakers. Default length 4.3 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
name |
string | Ada Lovelace |
First line, set in Inter Bold 64 px. |
role |
string | Mathematician and writer |
Second line, set in Inter Medium 34 px. |
accent |
color | #3b82f6 |
Color of the accent bar. |
textColor |
color | #ffffff |
Color of both text lines. |
hold |
number | 3 |
Seconds the lower third stays fully visible. |
A line draws across, the title rises out of it and the subtitle drops below it. Default length 4.0 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
title |
string | Chapter one |
Main line above the rule, set in Inter Bold. |
subtitle |
string | The first cut is the hardest |
Line below the rule, set in Inter Medium. Empty for none. |
accent |
color | #f97316 |
Color of the rule. |
textColor |
color | #ffffff |
Color of both lines. |
hold |
number | 2 |
Seconds the title stays fully visible. |
textSize |
number | 130 |
Title size in px. The subtitle is 36 percent of it. Both shrink to fit. |
A chapter progress bar that fills over the video, with the current chapter name. Default length 6.0 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
chapters |
string | Hook|Setup|Payoff |
Chapter names split with the pipe character. Each gets an equal share of the length. |
length |
number | 6 |
Length of the overlay in seconds, usually the length of the video. |
placement |
string, one of top, bottom |
top |
top or bottom of the safe area. |
accent |
color | #22c55e |
Color of the filled part. |
track |
color | #ffffff |
Color of the empty part, drawn at 30 percent opacity. |
textColor |
color | #ffffff |
Color of the chapter name. |
textSize |
number | 40 |
Chapter name size in px. |
A ring fills to a percentage while the number in its center counts up. Default length 4.8 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
value |
number | 72 |
Percentage from 0 to 100. |
label |
string | of viewers watch to the end |
Line under the ring. Empty for none. |
accent |
color | #38bdf8 |
Color of the filled arc. |
track |
color | #ffffff |
Color of the empty ring, drawn at 18 percent opacity. |
textColor |
color | #ffffff |
Color of the number and the label. |
countSeconds |
number | 1.6 |
Seconds the ring takes to fill. |
hold |
number | 2 |
Seconds the finished ring stays. |
A large quote mark pops, the quote rises in line by line, the author slides in. Default length 4.6 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
quote |
string | Simplicity is the ultimate sophistication. |
The quote. Wraps onto lines that fit the safe area. |
author |
string | Leonardo da Vinci |
Name under the quote. Empty for none. |
accent |
color | #a78bfa |
Color of the quote mark and the rule before the author. |
textColor |
color | #ffffff |
Color of the quote and the author. |
hold |
number | 2.5 |
Seconds the full quote stays. |
textSize |
number | 76 |
Quote size in px. Shrinks if the quote does not fit. |
A transition: slanted color bars sweep across, cover the frame for the cut and sweep off. Default length 1.2 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
colors |
string | #facc15|#f97316|#0f172a |
Bar colors split with the pipe character, back to front. The last one covers the cut. |
direction |
string, one of right, left, up, down |
right |
Direction the bars travel: right, left, up or down. |
stagger |
number | 0.07 |
Seconds between one bar and the next. |
travel |
number | 0.4 |
Seconds each bar takes to cross onto or off the frame. |
A follow banner: avatar circle pops, a panel slides out with the handle and a call to follow. Default length 4.2 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
handle |
string | @titlekit |
Account name, set in Inter Bold. |
label |
string | Follow for more |
Second line, set in Inter Medium. |
accent |
color | #ec4899 |
Color of the avatar circle. |
panel |
color | #111827 |
Color of the panel behind the text. |
textColor |
color | #ffffff |
Color of the text and the initial. |
hold |
number | 2.5 |
Seconds the banner stays fully visible. |
textSize |
number | 52 |
Handle size in px. The label is 62 percent of it. |
A subscribe button pops in, a cursor clicks it and it switches to its subscribed state. Default length 3.8 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
label |
string | Subscribe |
Button text before the click. |
doneLabel |
string | Subscribed |
Button text after the click. |
fill |
color | #ef4444 |
Button color before the click. |
doneFill |
color | #3f3f46 |
Button color after the click. |
textColor |
color | #ffffff |
Color of both labels. |
hold |
number | 1.5 |
Seconds the subscribed state stays before it fades out. |
textSize |
number | 72 |
Label size in px. Shrinks if the button would leave the safe area. |
Text types in character by character behind a blinking cursor. Default length 4.9 s.
| Parameter | Type | Default | Meaning |
|---|---|---|---|
text |
string | Every great edit starts with a blank timeline |
Text to type. Wraps onto lines that fit the safe area. |
textColor |
color | #ffffff |
Color of the text. |
accent |
color | #facc15 |
Color of the cursor. |
charsPerSecond |
number | 18 |
Typing speed. |
hold |
number | 1.5 |
Seconds the finished text stays before it fades out. |
textSize |
number | 80 |
Font size in px. Shrinks if the text does not fit the safe area. |