Motion Component Library
Production-ready interactive components from Origin Kit adapted to the Canadian AI visual identity. Each component is locally pinned, reviewed source code — no upstream code executes at render time.
User Cursor
A spring-physics cursor follower that replaces the OS cursor inside its surface. An arrow glyph tracks the pointer snappily; a labelled pill trails behind with a laggier spring, rocking with motion velocity and scaling on press. Touch devices receive null.
Maple / #c8401a
Pearl / #f0f0f0
import UserCursor from '@/components/origin-kit/user-cursor'
Link Preview
An underlined inline link that reveals a floating preview image of the destination on hover. The preview leans toward the cursor via a spring-driven translateX. Supports live OG image fetch via microlink.io or a custom uploaded image.
FeatureReel is built by Canadian AI using motion components from Origin Kit and rendered with Remotion.
Hover any underlined link above to see the live preview.
import LinkPreview from '@/components/origin-kit/link-preview'
Coverflow Gallery
A 3D coverflow where the active card sits upright in the spotlight while neighbours tilt back in perspective. Click any side card to bring it to centre. Supports keyboard navigation, autoplay, and looping. No external dependencies.
Click a side card or use arrow keys to navigate. Loop is always on.
import CoverflowGallery from '@/components/origin-kit/coverflow-gallery'
Blur Carousel
Hover an arrow and a soft blur creeps in from that side. Press an arrow and the image does a 3D tilt toward it; release to advance while the tilt springs back — the frame itself never moves. Supports horizontal and vertical movement. No external dependencies.
Horizontal
Vertical
Press and hold an arrow to see the 3D tilt. Keyboard: arrow keys.
import BlurCarousel from '@/components/origin-kit/blur-carousel'