Components
Glassmorphic dock Folder
This component is a high-fidelity desktop utility designed for modern AI operating environments. It reimagines the classic "folder" metaphor using glassmorphism to create a sense of depth and physical presence within a minimal dock navigation.
import { Component } from "@/components/ui/glassmorphic-dock-folder";
export default function DockDemo() {
return (
<div className="relative w-full h-[500px] bg-[#0a0a0a] overflow-hidden flex flex-col justify-end items-center pb-10">
{/* Simulated Wallpaper Gradient */}
<div className="absolute inset-0 bg-gradient-to-tr from-purple-900/20 via-black to-blue-900/20 pointer-events-none" />
{/* The Component */}
<Component />
{/* Helpful instruction for the user */}
<p className="absolute top-10 text-neutral-600 text-xs font-mono uppercase tracking-tighter">
Click the folder to test glassmorphism
</p>
</div>
);
}