CSS Touch Action Generator
Control touch behavior and gestures on elements
Presets
Touch Action
Enable all browser touch gesturesTarget Element
Preview Size
350px
300px
Live Preview
Pan
Zoom
Double-tap
This area demonstrates the touch-action setting. Try interacting with it on a touch device.
Current setting: auto
Box 1
Box 2
Box 3
Touch Action Comparison
auto
none
pan-x
pan-y
manipulation
Use Case Guide
noneCustom gesture handlers, drawing apps, games, maps
manipulationButtons, links (removes 300ms delay), interactive elements
pan-xVertical sliders, drag handles, custom vertical gestures
pan-yHorizontal carousels, swipe actions, tabs
pinch-zoomImage galleries with custom pan, zoomable content
CSS Output
.element {
touch-action: auto;
}