NaqshIn Persian it also means the part a thing plays. Here are twelve cursor patterns, each named for a piece of Persian craft or lore, each live, each with the exact values we hand to engineering. This is how we design, and how we build with AI.
Kārgāh — workshopDesign, motion and AI
Kārgāh
How we design, animate and ship with AI for every project. The motion and build tools are running on this page right now.
Tarh — design
A sketch and a system come first, then the screens.
- FigmaInterfaces and prototypes
- MotionInteractive prototypes in code
- Google FontsPliant and Datatype
- SVGGlyphs, icons and cursors
Samā — whirling
Movement that answers people.
- GSAPTimelines, Draggable, inertia
- CSSBlend modes and transitions
- CanvasTrail and repel fields
- Web AudioCursor sound cues
Memāri — architecture
Typed, versioned, fast.
- Next.jsApp Router shell
- ReactComponents and state
- TypeScriptTyped content layer
- GitHubVersioned and reviewed
Dastyār — assistant
Literally a helping hand: faster drafts, the same craft.
- ClaudeReasoning, copy and code
- Claude CodeAgentic build inside the repo
- MCPFigma, GitHub and browser as tools
- Vercel AI SDKStreaming AI into the UI
Kārvānfrom brief to launch
- Peymān — agreement
Goals, audience and tone, settled together on one page.
- Negāreh — picture
Figma frames, a type scale and a colour system.
- Javāneh — sprout
Claude Code scaffolds the app from the brief and the design rules.
- Pardākht — finish
The final strokes, as in a miniature. Motion tuned by hand in GSAP and Motion, reviewed live.
- Mahak — touchstone
Automated browser checks on every screen size and the console.
- Rūnamāyi — unveiling
Copy lives in JSON and each build goes to a preview link for your review.
Pardeh
Named for the painted curtains Persian storytellers unrolled in coffeehouses. A cursor in four scenes: eighteen seconds, scored with this page's sounds and built as one GSAP timeline.
The cursor is the first thing your users touch on every screen. It travels across everything we design. It can show people what a click will do. It can say thank you. Sepās — thank you for visiting. Homa Mofidian, product designer. Twelve cursor patterns below, each with a Persian name.
We design calm software and build it with AI, by hand where it matters.
Āftābparast — chameleon
MotionIn Persian, literally the sun-worshipper. One cursor that becomes a label over links, a caret over copy and a play button over media, so people know what a click will do before they click.
spring 500 / 32states idle · link · text · medialabel fade 150ms
come close to a button
Āhanrobā — magnet
GSAPIn Persian, literally the iron-snatcher. Primary actions pull toward the pointer inside a capture radius, so they are easier to hit while their visual size stays the same.
radius 110pxpull 0.4label pull 0.15ease elastic.out(1, 0.35)
move slowly, then flick
Hamrāh — companion
Motionthe one who walks beside you. A precise dot with a ring that follows a step behind on a spring. It adds weight and character while the dot keeps aim exact.
stiffness 150damping 15mass 0.6
press to widen the lens
Jām-e Jam — Jamshid's cup
Motionin which Persian poets say the whole world could be seen. A lens that reveals the finished design under the wireframe, made for before-and-after case studies and design reviews.
radius 72 → 170px on pressfollow 300 / 30lens 220 / 22
grab a tile, throw it
Chowgān — polo
GSAPthe Persian game Siavash plays in the Shahnameh. Grab cursors with inertia on release and a tilt that follows drag speed, so objects feel like they carry real weight.
edge resistance 0.75tilt ±12°plugin Draggable + Inertia
Hold to archive
click: ripple · hold: seal
Mohr — seal
MotionA ripple confirms every press; holding draws a ring that commits a destructive action only once it closes, the way a seal is pressed and held. Let go early to cancel.
ripple 700mshold 900ms linearcancel 200ms
snaps to 8pt
Ostorlāb — astrolabe
Motionthe instrument Persian astronomers used to read the sky. Hairlines with a live coordinate readout that snap to an 8pt grid, the precision cursor of canvas and editor tools.
grid 8pxspring 900 / 60readout x × y
cross the seam
Āyeneh-kāri — mirrorwork
GSAPthe cut-glass walls of Persian palaces and shrines that turn any light back on itself. A difference-mode disc stays visible on any background and inverts the type beneath it, legible on light and dark sections alike.
size 64pxhover scale 2.4blend difference
whip it across
Shahāb — shooting star
GSAPSquash and stretch driven by pointer speed and turned to the direction of travel. It shows momentum on playful brand surfaces.
follow 0.22 / framemax stretch 1.9×min speed 0.6px
Workshop pass
S. Karimi0042 · 2026
circle the card
Khātam — inlay
MotionKhatam is the Shiraz craft of tiny wood, bone and metal pieces set into star patterns that shimmer as they turn. Cards tilt toward the pointer with a moving glare and layered depth. Keep it to one hero object per view.
max tilt 16°perspective 900pxspring 180 / 18
write a loop
Nastaliq — calligraphy
GSAPNastaliq is the hanging Persian script whose strokes thin as the reed pen lifts. Sixteen points, each chasing the one before, tapering to a fine tail. A signature gesture for portfolios, too loud for productivity tools.
points 16follow 0.35 / framescale 1 → 0.15
touch the water
Howz — pool
Canvasthe still water at the heart of a Persian garden. A field of dots parts around the pointer and settles again behind it, like water after a touch. Quiet feedback for empty states and landing backgrounds.
gap 20pxradius 90pxreturn 0.18 / frame