Floating Label Customize

PreviousNext

component for the Floating Label Customize

Docs
spectrumuicomponent

Preview

Loading preview…
app/registry/floating-label-input/usage/floating-label-customize.tsx
import React from "react";
import {
  FloatingInput,
  FloatingLabel,
} from "@/components/ui/floating-label-input";

const FloatingLabelInputCustomize = () => {
  return (
    <div className="relative">
      <FloatingInput id="floating-customize" />
      <FloatingLabel htmlFor="floating-customize">Customize</FloatingLabel>
    </div>
  );
};

export default FloatingLabelInputCustomize;

Installation

npx shadcn@latest add @spectrumui/floating-label-customize

Usage

import { FloatingLabelCustomize } from "@/components/floating-label-customize"
<FloatingLabelCustomize />