fab uifab ui

Input

A text input field for capturing user data.

'use client';

import { Input } from '@/components/ui/input';

export function InputDefault() {
  return <Input type='text' placeholder='Enter text...' className='w-64' />;
}

Installation

pnpm dlx shadcn@latest add @fab-ui/input

Usage

import { Input } from "@/components/ui/input"
<Input type='email' placeholder='Enter your email' />

Examples

Disabled

'use client';

import { Input } from '@/components/ui/input';

export function InputDisabled() {
  return (
    <Input type='text' placeholder='Disabled input' disabled className='w-64' />
  );
}

Input Group

An input with addons like icons, buttons, or text on either side.

Label

A text label for form inputs that provides accessible labeling.

On this page

InstallationUsageExamplesDisabled