Spark UI
Back to UI Kit

Spline Pulse

A smooth spline area with a glowing trace that morphs between 7D, 30D and 90D, and a crosshair dot that springs between points.

Interactive Stage Preview

Customize

6 options
Accent Color
Points
24
Line Width
2.5
Grid
Glow
Animation Speed
100

Get this component

Copies the component into your project, installs what it needs, and pulls down its images. Nothing to download by hand.

npx spark-ui-registry@latest add spline-pulse

Writes to components/spark-ui/ by default; override with --dir. The file is yours to edit; there is no package to keep in sync.

Or let an AI agent pull it in for you. Set up the MCP server
PropertyTypeDefaultDescription
theme'dark' | 'light''dark'Colour scheme of the card.
compactbooleanfalseShrinks the card to a smaller fixed height.
colorstring (hex)'#ff8a3d'Line, glow and fill color.
pointsnumber24Number of samples along the curve.
strokeWidthnumber2.5Stroke width of the trace.
showGridbooleantrueShow dashed guide lines.
glowbooleantrueSoft neon glow under the line (dark theme).
speednumber100Playback speed of entry and transition animations, as a percentage.