Skip to main content

use-mask-input

A React Hook for building elegant and simple input masks

npm versionbundle sizenpm downloads
Get Started →View on GitHub
example.tsx
import { useMaskInput } from 'use-mask-input';

function PhoneInput() {
  const phoneMask = useMaskInput({
    mask: '(99) 99999-9999',
  });

  return (
    <input 
      type="tel"
      ref={phoneMask}
      placeholder="(00) 00000-0000"
    />
  );
}
✨

Simple & Intuitive

Clean and straightforward API that feels natural to use. Get started in seconds with just a few lines of code.

🎯

Framework Compatible

Works seamlessly with React Hook Form, React Final Form, and Next.js. Perfect for any React project.

🚀

Powerful & Flexible

Supports multiple mask types: static, optional, dynamic, alias, alternator, and preprocessing. Handle any input format you need.

💎

TypeScript Ready

Full TypeScript support with comprehensive type definitions. Get autocomplete and type safety out of the box.

📦

Lightweight

Minimal bundle size impact. Optimized for performance without sacrificing functionality or developer experience.

🏆

Production Ready

Well tested, actively maintained, and trusted by developers worldwide. Ready for your production applications.