Skip to content

Latest commit

 

History

History
278 lines (212 loc) · 14.6 KB

parameters.md

File metadata and controls

278 lines (212 loc) · 14.6 KB

Parameters

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.

Value formats

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.

Common to every template

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.

bar-chart

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.

caption

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.

circle-wipe

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.

counter

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.

cta-button

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.

element

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.

glitch-title

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.

hook-title

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.

kinetic-words

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.

letter-cascade

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.

lower-third

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.

mask-reveal

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.

progress-bar

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.

progress-ring

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.

quote-card

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.

shape-wipe

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.

social-handle

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.

subscribe-click

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.

typewriter

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.