Back to Skills

tailwindcss-interactivity

verified

Interactivity utilities Tailwind CSS v4.1. Cursor (cursor-*), Scroll (scroll-smooth, scroll-snap-*, overscroll-*), User select (select-*), Pointer events (pointer-events-*), Touch action, Resize, Caret color, Accent color.

View on GitHub

Marketplace

fusengine-plugins

fusengine/agents

Plugin

fuse-tailwindcss

development

Repository

fusengine/agents

plugins/tailwindcss/skills/tailwindcss-interactivity/SKILL.md

Last Verified

January 22, 2026

Install Skill

Select agents to install to:

Scope:
npx add-skill https://github.com/fusengine/agents/blob/main/plugins/tailwindcss/skills/tailwindcss-interactivity/SKILL.md -a claude-code --skill tailwindcss-interactivity

Installation paths:

Claude
.claude/skills/tailwindcss-interactivity/
Powered by add-skill CLI

Instructions

# Tailwind CSS Interactivity Utilities

Comprehensive utilities for controlling user interaction behaviors and cursor styles in Tailwind CSS v4.1.

## Categories

### Cursor Utilities
Control the cursor appearance on elements
- `cursor-*` - Standard cursors (auto, default, pointer, wait, text, move, help, not-allowed, none, etc.)
- Support for resize cursors (col-resize, row-resize, n-resize, e-resize, s-resize, w-resize, ne-resize, nw-resize, se-resize, sw-resize, ew-resize, ns-resize, nesw-resize, nwse-resize)
- Zoom cursors (zoom-in, zoom-out)
- Grab cursors (grab, grabbing)
- Special cursors (context-menu, progress, cell, crosshair, vertical-text, alias, copy, no-drop, all-scroll)

### Scroll Behavior & Snap
Manage scrolling and snap behavior
- `scroll-smooth` - Enable smooth scrolling
- `scroll-snap-type` - Define snap container behavior (snap-none, snap-x, snap-y, snap-both)
- `scroll-snap-align` - Position snap points (snap-start, snap-center, snap-end)
- `scroll-snap-stop` - Force snap stops (snap-always, snap-normal)
- `overscroll-behavior` - Control overscroll area (overscroll-auto, overscroll-contain, overscroll-none)
- Support for axis-specific variants (x, y)

### User Selection
Control text selection behavior
- `select-none` - Disable text selection
- `select-text` - Allow text selection
- `select-all` - Select all text when clicked
- `select-auto` - Browser default selection

### Pointer Events
Control element interactivity
- `pointer-events-none` - Element cannot be interacted with
- `pointer-events-auto` - Element is interactive (default)

### Touch Action
Define how touch gestures are handled
- `touch-auto` - Browser default touch handling
- `touch-none` - Disable all touch behaviors
- `touch-pan-x` - Allow horizontal panning only
- `touch-pan-y` - Allow vertical panning only
- `touch-manipulation` - Allow panning and zoom only (no double-tap zoom)
- Support for directional variants (pan-up, pan-down, pan-left, pan-right, pinch-zoom)

### Resize
Co

Validation Details

Front Matter
Required Fields
Valid Name Format
Valid Description
Has Sections
Allowed Tools
Instruction Length:
3292 chars