Components
npx shadcn@latest add https://21st.dev/r/meghtrix/grid-backgroundLoading preview...
// This is file of your component
// You can use any dependencies from npm; we import them automatically in package.json
import { cn } from "@/lib/utils";
import { useState } from "react";
export const Component = () => {
const [count, setCount] = useState(0);
return (
<div className="min-h-screen w-full bg-[#000000] relative text-white">
{/* Gradient Diagonal Lines Pattern */}
<div
className="absolute inset-0 z-0 pointer-events-none"
style={{
backgroundImage: `
repeating-linear-gradient(45deg, rgba(0, 255, 65, 0.08) 0, rgba(0, 255, 65, 0.08) 1px, transparent 1px, transparent 12px),
repeating-linear-gradient(-45deg, rgba(0, 255, 65, 0.08) 0, rgba(0, 255, 65, 0.08) 1px, transparent 1px, transparent 12px),
repeating-linear-gradient(90deg, rgba(0, 255, 65, 0.03) 0, rgba(0, 255, 65, 0.03) 1px, transparent 1px, transparent 4px)
`,
backgroundSize: '24px 24px, 24px 24px, 8px 8px',
}}
/>
{/* Your Content/Components */}
</div>
);
};
export default Component;Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...
Loading preview...