playhead-viewport-start="top"
playhead-viewport-end="top"
playhead-element-start="top"
playhead-element-end="bottom"

hero playhead

playhead-viewport-start="center"
playhead-viewport-end="center"
playhead-element-start="top"
playhead-element-end="bottom"

symmetric playhead

playhead-viewport-start="bottom"
playhead-viewport-end="top"
playhead-element-start="top"
playhead-element-end="bottom"

default playhead

playhead-viewport-start="bottom"
playhead-viewport-end="top"
playhead-element-start="center"
playhead-element-end="center"

centered playhead

playhead-viewport-start="top"
playhead-viewport-end="top"
playhead-element-start="top"
playhead-element-end="bottom"

pin (sticky)

playhead-viewport-start="bottom"
playhead-viewport-end="top"
playhead-element-start="top"
playhead-element-end="center"

reversed hero

demonstrating rotation, scale, opacity, and color effects

multi-effects
rotating
scaling
fading
combined