An organic, calming modal with soft transitions and natural motifs.
1const [isOpen, setIsOpen] = useState(false);23<button
npx zeroui@latest add modal-nature
npm install lucide-react
Create a new file and paste the following code:
"use client"; import React, { useEffect, useState } from "react"; import { X, Leaf } from "lucide-react"; interface ModalNatureProps { isOpen: boolean; onClose: () => void; title?: string; children: React.ReactNode; className?: string; } export default function ModalNature({ isOpen, onClose, title, children, className = "", }: ModalNatureProps) { // Implementation details... return ( // Component JSX... <div /> ); }