Background 1Retro

1"use client";
2 
3import React from "react";
4 
5export function Background1Retro() {
6  return (
7    <div className="absolute inset-0 overflow-hidden bg-white font-mono z-0">
8        {/* Grid Pattern */}
9        <div className="absolute inset-0 bg-[linear-gradient(to_right,#0000001a_1px,transparent_1px),linear-gradient(to_bottom,#0000001a_1px,transparent_1px)] bg-[size:40px_40px]"></div>
10        
11        {/* Dots Pattern */}
12        <div className="absolute inset-0 bg-[radial-gradient(#00000033_1px,transparent_1px)] bg-[size:20px_20px] [mask-image:radial-gradient(ellipse_at_center,black_70%,transparent_100%)]"></div>
13        
14        {/* Floating elements */}
15        <div className="absolute top-10 left-10 text-[10vw] text-black/5 font-black uppercase pointer-events-none select-none">
16            RETRO_UI
17        </div>
18         <div className="absolute bottom-10 right-10 text-[10vw] text-black/5 font-black uppercase pointer-events-none select-none">
19            SYSTEM
20        </div>
21    </div>
22  );
23}