What Figma's Dev Mode gives you for marking, annotating and tracking handoff.
AI workflow Document behaviour with open questions listed
Viewport: All
Viewport references are useful starting points. Design breakpoints should respond to the content, not specific device models. Choosing a viewport changes what is emphasised; nothing is hidden.
Applies to All viewports
Frames, components, instances and sections can be marked ready for dev. Developers get a view of everything marked ready in the file, and are notified when a design is marked.
Source
Applies to All viewports
Annotations surface important properties and attach text notes directly to the design. Measurements help developers see spacing and sizing.
Source
Applies to All viewports
Compare changes shows a frame's version history, and instances can be compared against their main component.
Source
Applies to All viewports
Any keyboard-operable interface has a mode of operation where the keyboard focus indicator is visible.
Source
Applies to All viewports
When a page is navigated sequentially, components receive focus in an order that preserves meaning and operability.
Source
Applies to All viewports · Touch and Pointer input
There is no single number. WCAG sets a floor for the web; Apple and Android recommend larger targets for their platforms. Design to the platform you are shipping on, and never below the WCAG minimum.
Touch target guidance by source
24 × 24CSS px
Minimum, with spacing and inline exceptions
Standard requirementVerified 7 Oct 2026
44 × 44CSS px
Enhanced
Standard requirementVerified 7 Oct 2026
44 × 44pt
Default control size. Minimum is 28 × 28 pt
Design-system conventionVerified 7 Oct 2026
48 × 48dp
Recommended, with 8 dp or more between targets
Design-system conventionVerified 7 Oct 2026
Not stated
The Button page gives no minimum touch-target size
Design-system conventionVerified 7 Oct 2026
| Source | Guidance | To scale | Weight | Checked |
|---|---|---|---|---|
| Global | ||||
WCAG WCAG 2.2 (AA)(opens in a new tab) | 24 × 24CSS pxMinimum, with spacing and inline exceptions | Standard requirement | Verified 7 Oct 2026 | |
WCAG WCAG 2.2 (AAA)(opens in a new tab) | 44 × 44CSS pxEnhanced | Standard requirement | Verified 7 Oct 2026 | |
Apple Apple, iOS and iPadOS(opens in a new tab) | 44 × 44ptDefault control size. Minimum is 28 × 28 pt | Design-system convention | Verified 7 Oct 2026 | |
Material Android / Material(opens in a new tab) | 48 × 48dpRecommended, with 8 dp or more between targets | Design-system convention | Verified 7 Oct 2026 | |
| Singapore | ||||
SGDS SGDS, Button(opens in a new tab) | Not statedThe Button page gives no minimum touch-target size | n/a | Design-system convention | Verified 7 Oct 2026 |
Shortcut takeaway: Treat 24 × 24 CSS px as the floor a standard requires, and the platform figures as the size to design to. SGDS's Button page states no minimum of its own. For a Singapore government web service, the WCAG figure is the one you are held to.
Squares are drawn at 1 unit = 1 CSS px. CSS px, pt and dp are each platform's density-independent unit, so the sizes are comparable but not identical on a given device.