Easing Graphs
Interactive easing-curve editor and visualizer at easing.dev that exports one curve to CSS, Motion, SwiftUI, UIKit, and Core Animation.
Easing Graphs (easing.dev) is an interactive easing editor built by Alex (@alexvanderzon) and Lochie (@lochieaxon) — not @remvze, who only surfaced it as a bookmark. Source: easing.dev, https://www.easing.dev/in-out-cubic, 2026-06-13
The tool organizes curves into two families — Cubic Easing and Spring — filterable by All / In / Out / In-Out. The catalog covers the standard polynomial families (In/Out/In-Out × Quad, Cubic, Quart, Quint, Expo, Circ), Linear, and named curves such as Anticipate, Quick Out, Overshoot Out, Swift Out, and Snappy Out. Source: easing.dev, https://easing.dev, 2026-06-13
Each curve opens an editor with draggable cubic-bezier control points (x1, y1, x2, y2), a duration control, a live position preview (play/pause), and a "New Graph" mode for authoring custom curves. One-click Copy Code exports the same curve to CSS, Motion, SwiftUI, UIKit, Core Animation, and Raw — e.g. In Out Cubic emits cubic-bezier(0.645, 0.045, 0.355, 1). Source: easing.dev, https://www.easing.dev/in-out-cubic, 2026-06-13
Cross-platform export (web plus Apple/native targets) is the differentiator over single-output cubic-bezier pickers. Complements design-engineering-polish's easing philosophy — custom cubic-bezier over named easings, spring physics for interactive elements — and the broader Animation Vocabulary (Animations.dev).
Every curve also has its own shareable permalink (e.g. easing.dev/in-out-cubic), so a tuned curve can be linked directly in a design spec or PR rather than described in prose. Source: easing.dev, https://www.easing.dev/in-out-cubic, 2026-06-13
The reviewed bookmark image shows the tool's core value at a glance: a dark canvas with a grid of named cubic and spring curves such as Anticipate, Quick Out, Overshoot Out, Swift Out, Snappy Out, In Quad, In Cubic, In Expo, and Out Cubic. Use it as a vocabulary surface before tuning individual values. Source: local X bookmark artifact, 2026-06-30
Stack fit (Kevin)
- The Motion export drops straight into Kevin's Frontend and Design Skills work; the CSS
cubic-bezier()output pastes into Tailwindtransition-timing-functionutilities andcn()-composed components. - Reinforces the design-engineering-polish rule of authoring custom cubic-beziers instead of leaning on
ease-in-out— easing.dev makes tuning and copying those curves a few drags. - Spring family plus live preview supports the spring-physics defaults favored across the taste-* skills and Frontier Stack 2026.
- SwiftUI / UIKit / Core Animation outputs make curves reusable if polish work crosses into native/iOS surfaces.
- Curve permalinks double as a shared vocabulary — link a specific easing in review instead of describing it in prose.
Versioning
Easing Graphs is a hosted web tool with no public package version or release feed found during this review. The current authority is the live easing.dev surface checked on 2026-06-30 plus the local X bookmark artifact. Source: https://www.easing.dev/, 2026-06-30
Timeline
- 2026-06-30 | Deep-reviewed the local bookmark artifact and refreshed this page with the source tweet, artifact card, and hosted-surface versioning note. Source: X/@remvze, 2026-03-15; Source: easing.dev, 2026-06-30
- 2026-06-13 | Quality remediation: corrected authorship to Alex + Lochie (not @remvze) and documented the interactive editor with CSS/Motion/SwiftUI/UIKit/Core Animation export. Source: https://www.easing.dev/in-out-cubic
- 2026-03-15 | Shared by @remvze: "Easing Graphs - A curated collection of easing graphs" referencing easing.dev (51 likes, 34 bookmarks). Source: X/@remvze, 2026-03-15