PageSourceSearch

https://mudasir.in/

html mudasir.in collected 2026-09-24 14:02:47 UTC 257,076 bytes, 81 lines download raw bytes

1<!DOCTYPE html><html lang="en" class="__variable_inter_1nj207z"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=5, viewport-fit=cover"/><link rel="stylesheet" href="/_next/static/css/vinext-stage-runtime~0virtual_vinext-response-stage.-3BATVr8.css" data-rsc-css-href="/_next/static/css/vinext-stage-runtime~0virtual_vinext-response-stage.-3BATVr8.css" data-precedence="vite-rsc/importer-resources"/><link rel="modulepreload" fetchPriority="low" href="/_next/static/chunks/index-D6PhHmbP.js"/>
1<script src="/_next/static/chunks/rolldown-runtime-hePW80VL.js" type="module" async=""></script>
1<script src="/_next/static/chunks/framework-A1pNZAzD.js" type="module" async=""></script>
1<script src="/_next/static/chunks/vinext-hIO3Xa5v.js" type="module" async=""></script>
1<link rel="modulepreload" href="/_next/static/chunks/layout-segment-context-B5WKWh0X.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/theme-provider-3NjX2aLx.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/favicon-sync-DAAd9aai.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/motion-provider-BonzTz0x.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/MotionConfigContext-CHVjBG45.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/header-BElBYSEA.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/createReactComponent-DT9hXg-B.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconArrowUpRight-DDeO9cQb.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconCheck-BRiZvyIn.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconChevronDown-C6tu4Zvl.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconSun-DMX0u9FP.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconSearch-Dl4kTgK5.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconX-BAE1PfU-.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/link-50nOxOHj.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/query-DugiHe4Q.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/site-ChG8Lyic.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/pointer-pattern-BpgeRHv6.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/floating-actions-B7CFXd2e.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconLoader2-6aYeBs2n.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconPalette-Clhq_X_O.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconQuote-DihUbjkK.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconSend-BIegokMM.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/pwa-register-wpLxMjfG.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/local-time-hHzICFzo.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/pwa-install-button-hh_wGC3X.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/image-DPDZJi-4.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/get-in-touch-BGg5SKK4.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/IconCircleCheck-CgWNs9vP.js" crossorigin=""/><link rel="modulepreload" href="/_next/static/chunks/input-B1aNX2UM.js" crossorigin=""/><title>Mudasir Fayaz — Frontend Engineer | React &amp; Next.js Developer</title><meta name="description" content="Mudasir Fayaz is a Frontend Engineer from Kashmir specializing in React, Next.js, Tailwind CSS, and Motion. Building fast, interactive web apps."/><meta name="application-name" content="Mudasir Fayaz"/><meta name="keywords" content="Mudasir Fayaz,Frontend Engineer,frontend engineer Kashmir,React developer India,Next.js freelancer,Tailwind CSS developer,react developer,next.js,tailwind css,ui developer,portfolio"/><meta name="author" content="Mudasir Fayaz"/><link rel="author" href="https://mudasir.in"/><meta name="creator" content="Mudasir Fayaz"/><meta name="publisher" content="Mudasir Fayaz"/><meta name="format-detection" content="telephone=no"/><meta name="category" content="technology"/><meta name="robots" content="index, follow"/><meta name="googlebot" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1"/><meta property="og:title" content="Mudasir Fayaz — Frontend Engineer | React &amp; Next.js Developer"/><meta property="og:description" content="Frontend Engineer from Kashmir building fast, interactive web apps with React, Next.js &amp; Tailwind CSS."/><meta property="og:url" content="https://mudasir.in"/><meta property="og:site_name" content="Mudasir Fayaz"/><meta property="og:type" content="website"/><meta property="og:locale" content="en_US"/><meta property="og:image" content="https://mudasir.in/meta-img.png"/>
1<meta property="og:image:width" content="1200"/><meta property="og:image:height" content="630"/><meta property="og:image:alt" content="Mudasir Fayaz — Frontend Engineer"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:site" content="@mudasirbuilds"/><meta name="twitter:title" content="Mudasir Fayaz — Frontend Engineer | React &amp; Next.js Developer"/><meta name="twitter:description" content="Frontend Engineer from Kashmir building fast, interactive web apps with React, Next.js &amp; Tailwind CSS."/><meta name="twitter:creator" content="@mudasirbuilds"/><meta name="twitter:image" content="https://mudasir.in/meta-img.png"/><link rel="icon" href="/favicon.ico?9ecfcc8f0ead0bf3" type="image/x-icon" sizes="256x256"/><link rel="icon" href="/icon.svg" type="image/svg+xml"/><link rel="icon" href="/icons/icon-192.png" type="image/png" sizes="192x192"/><link rel="icon" href="/icons/icon-512.png" type="image/png" sizes="512x512"/><link rel="apple-touch-icon" href="/icons/apple-touch-icon.png"/><link rel="manifest" href="/manifest.webmanifest"/><link rel="canonical" href="https://mudasir.in"/><meta name="mobile-web-app-capable" content="yes"/><meta name="apple-mobile-web-app-title" content="Mudasir Fayaz"/><meta name="apple-mobile-web-app-status-bar-style" content="default"/><meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)"/><meta name="theme-color" content="#0b0b0f" media="(prefers-color-scheme: dark)"/>
1<script>Object.assign(((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}),{params:{},nav:{"pathname":"/","searchParams":[]}})</script>
1<link rel="modulepreload" href="/_next/static/chunks/index-D6PhHmbP.js" />
2<link rel="preload" href="/_next/static/_vinext_fonts/inter-9df0d028785c/inter-1ab1ad55.woff2" as="font" type="font/woff2" crossorigin />
3<style data-vinext-fonts>/* cyrillic-ext */
4@font-face {
5  font-family: 'Inter';
6  font-style: normal;
7  font-weight: 100 900;
8  font-display: swap;
9  src: url(/_next/static/_vinext_fonts/inter-9df0d028785c/inter-7249155f.woff2) format('woff2');
10  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
11}
12/* cyrillic */
13@font-face {
14  font-family: 'Inter';
15  font-style: normal;
16  font-weight: 100 900;
17  font-display: swap;
18  src: url(/_next/static/_vinext_fonts/inter-9df0d028785c/inter-e34c5f1b.woff2) format('woff2');
19  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
20}
21/* greek-ext */
22@font-face {
23  font-family: 'Inter';
24  font-style: normal;
25  font-weight: 100 900;
26  font-display: swap;
27  src: url(/_next/static/_vinext_fonts/inter-9df0d028785c/inter-6e1a6b2b.woff2) format('woff2');
28  unicode-range: U+1F00-1FFF;
29}
30/* greek */
31@font-face {
32  font-family: 'Inter';
33  font-style: normal;
34  font-weight: 100 900;
35  font-display: swap;
36  src: url(/_next/static/_vinext_fonts/inter-9df0d028785c/inter-656bbed6.woff2) format('woff2');
37  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
38}
39/* vietnamese */
40@font-face {
41  font-family: 'Inter';
42  font-style: normal;
43  font-weight: 100 900;
44  font-display: swap;
45  src: url(/_next/static/_vinext_fonts/inter-9df0d028785c/inter-fc83e075.woff2) format('woff2');
46  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
47}
48/* latin-ext */
49@font-face {
50  font-family: 'Inter';
51  font-style: normal;
52  font-weight: 100 900;
53  font-display: swap;
54  src: url(/_next/static/_vinext_fonts/inter-9df0d028785c/inter-749a3084.woff2) format('woff2');
55  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
56}
57/* latin */
58@font-face {
59  font-family: 'Inter';
60  font-style: normal;
61  font-weight: 100 900;
62  font-display: swap;
63  src: url(/_next/static/_vinext_fonts/inter-9df0d028785c/inter-1ab1ad55.woff2) format('woff2');
64  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
65}
66
67@font-face {
68  font-family: 'Inter Fallback';
69  src: local("Arial");
70  ascent-override: 90.44%;
71  descent-override: 22.52%;
72  line-gap-override: 0.00%;
73  size-adjust: 107.12%;
74}
75
76.__font_inter_1nj207z { font-family: 'Inter', 'Inter Fallback'; font-style: normal; }
77
78.__variable_inter_1nj207z { --font-inter: 'Inter', 'Inter Fallback'; }
79</style>
80</head><body class="min-h-svh bg-background antialiased">
80<script>(function(){try{var a="mudasirweb-accent";var m="mudasirweb-mode";var t=[{"id":"orange-burst","c":["#FF6A00","#FF8E53","#FFB347","#FFF4EC"],"g":"linear-gradient(135deg, #FF6A00, #FF8E53)","b":"#FFF4EC","f":"#FFFFFF","ab":"#ba4d00"},{"id":"mango-splash","c":["#FFB703","#FFC837","#FFD98A","#FFF8E1"],"g":"linear-gradient(135deg, #FFB703, #FFC837)","b":"#FFF8E1","f":"#FFFFFF","ab":"#976c02"},{"id":"grape-royale","c":["#5F0A87","#9D4EDD","#C77DFF","#F5EEFA"],"g":"linear-gradient(135deg, #5F0A87, #9D4EDD)","b":"#F5EEFA","f":"#FFFFFF","ab":"#5f0a87"},{"id":"berry-crush","c":["#D4145A","#F857A6","#FF7EB3","#FDEAF1"],"g":"linear-gradient(135deg, #D4145A, #F857A6)","b":"#FDEAF1","f":"#FFFFFF","ab":"#d4145a"},{"id":"apple-mint","c":["#00A878","#2AF598","#7DEFC4","#E9FBF4"],"g":"linear-gradient(135deg, #00A878, #2AF598)","b":"#E9FBF4","f":"#FFFFFF","ab":"#007a57"},{"id":"blueberry-ice","c":["#2193B0","#3A7BD5","#6DD5FA","#EAF6FA"],"g":"linear-gradient(135deg, #2193B0, #3A7BD5)","b":"#EAF6FA","f":"#FFFFFF","ab":"#1b778f"},{"id":"cherry-neon","c":["#FF0844","#FF416C","#FF6A88","#FFE9EE"],"g":"linear-gradient(135deg, #FF0844, #FF416C)","b":"#FFE9EE","f":"#FFFFFF","ab":"#e6073d"},{"id":"coconut-cream","c":["#B08968","#D6BFA9","#E2D1C3","#FAF7F2"],"g":"linear-gradient(135deg, #B08968, #D6BFA9)","b":"#FAF7F2","f":"#FFFFFF","ab":"#8f6f54"},{"id":"midnight-ink","c":["#0F2027","#203A43","#2C5364","#E6EEF2"],"g":"linear-gradient(135deg, #0F2027, #203A43)","b":"#E6EEF2","f":"#FFFFFF","ab":"#0f2027"},{"id":"royal-slate","c":["#2D2F4A","#4B4E6D","#8A8DB0","#ECECF2"],"g":"linear-gradient(135deg, #2D2F4A, #4B4E6D)","b":"#ECECF2","f":"#FFFFFF","ab":"#2d2f4a"},{"id":"emerald-elegance","c":["#0F9B8E","#1CB5A3","#A8E6CF","#EAF8F2"],"g":"linear-gradient(135deg, #0F9B8E, #1CB5A3)","b":"#EAF8F2","f":"#FFFFFF","ab":"#0c7e73"},{"id":"charcoal-gold","c":["#232526","#414345","#C9A24D","#F6F2E8"],"g":"linear-gradient(135deg, #232526, #414345)","b":"#F6F2E8","f":"#FFFFFF","ab":"#232526"},{"id":"ivory-silk","c":["#B7A98F","#D6CFC4","#EDE6D8","#F9F7F3"],"g":"linear-gradient(135deg, #B7A98F, #D6CFC4)","b":"#F9F7F3","f":"#FFFFFF","ab":"#786f5e"},{"id":"plum-noir","c":["#4A2F6E","#7B4AE2","#A98BE8","#F2ECFA"],"g":"linear-gradient(135deg, #4A2F6E, #7B4AE2)","b"
80:"#F2ECFA","f":"#FFFFFF","ab":"#4a2f6e"},{"id":"steel-blue","c":["#1F3C88","#27496D","#A3CEF1","#EEF4FA"],"g":"linear-gradient(135deg, #1F3C88, #27496D)","b":"#EEF4FA","f":"#FFFFFF","ab":"#1f3c88"},{"id":"mocha-luxe","c":["#3E2723","#5D4037","#D7CCC8","#F4EFEC"],"g":"linear-gradient(135deg, #3E2723, #5D4037)","b":"#F4EFEC","f":"#FFFFFF","ab":"#3e2723"},{"id":"obsidian-night","c":["#1C1F2A","#3A3F5C","#6C7293","#E8EAF0"],"g":"linear-gradient(135deg, #1C1F2A, #3A3F5C)","b":"#E8EAF0","f":"#FFFFFF","ab":"#1c1f2a"},{"id":"nordic-frost","c":["#9FB3C8","#C9D6E3","#EAF0F6","#F4F7FB"],"g":"linear-gradient(135deg, #9FB3C8, #C9D6E3)","b":"#F4F7FB","f":"#FFFFFF","ab":"#687583"},{"id":"aurora-teal","c":["#0F766E","#14B8A6","#5EEAD4","#E6FAF7"],"g":"linear-gradient(135deg, #0F766E, #14B8A6)","b":"#E6FAF7","f":"#FFFFFF","ab":"#0f766e"},{"id":"graphite-amber","c":["#2A2A2A","#3F3F3F","#F4A261","#FAF4EC"],"g":"linear-gradient(135deg, #2A2A2A, #3F3F3F)","b":"#FAF4EC","f":"#FFFFFF","ab":"#2a2a2a"},{"id":"sage-stone","c":["#4F6F6F","#6E8F8F","#CAD2C5","#F1F5F2"],"g":"linear-gradient(135deg, #4F6F6F, #6E8F8F)","b":"#F1F5F2","f":"#FFFFFF","ab":"#4f6f6f"},{"id":"deep-ocean","c":["#003566","#0077B6","#4CC9F0","#EAF4FB"],"g":"linear-gradient(135deg, #003566, #0077B6)","b":"#EAF4FB","f":"#FFFFFF","ab":"#003566"},{"id":"carbon-violet","c":["#3A0CA3","#7209B7","#9D4EDD","#F0ECFA"],"g":"linear-gradient(135deg, #3A0CA3, #7209B7)","b":"#F0ECFA","f":"#FFFFFF","ab":"#3a0ca3"},{"id":"linen-pearl","c":["#B3A99A","#DAD7CD","#EDEAE6","#F9F7F5"],"g":"linear-gradient(135deg, #B3A99A, #DAD7CD)","b":"#F9F7F5","f":"#FFFFFF","ab":"#756f65"},{"id":"forest-ink","c":["#0B3D2E","#1B5E4B","#A7C7B7","#EAF4EF"],"g":"linear-gradient(135deg, #0B3D2E, #1B5E4B)","b":"#EAF4EF","f":"#FFFFFF","ab":"#0b3d2e"},{"id":"bronze-shadow","c":["#5A3E36","#8A6A5B","#B08968","#F4EEE9"],"g":"linear-gradient(135deg, #5A3E36, #8A6A5B)","b":"#F4EEE9","f":"#FFFFFF","ab":"#5a3e36"},{"id":"cloud-silver","c":["#64748B","#94A3B8","#CBD5E1","#F6F8FB"],"g":"linear-gradient(135deg, #64748B, #94A3B8)","b":"#F6F8FB","f":"#FFFFFF","ab":"#64748b"},{"id":"royal-indigo","c":["#312E81","#4F46E5","#A5B4FC","#EEF0FF"],"g":"linear-gradient(135deg, #312E81, #4F46E5)","b":"#EEF0FF","f":"#FFFFFF","ab":"#312e81"},{"id":"sunset-coral","c":["#E4572E","#F2762E","#F9A870","#FFF3EC"],"g":"linear-gradient(135deg, #E4572E, #F2762E)","b":"#FFF3EC","f":"#FFFFFF","ab":"#b94625"},{"id":"lime-zest","c":["#5C8A00","#8BC34A","#CDE89A","#F5FAEA"],"g":"linear-gradient(135deg, #5C8A00, #8BC34A)","b":"#F5FAEA","f":"#FFFFFF","ab":"#537c00"}];var s=document.documentElement.style;var id=localStorage.getItem(a);if(id){for(var i=0;i!==t.length;i++){if(t[i].id===id){s.setProperty("--theme-color-1",t[i].c[0]);s.setProperty("--theme-color-2",t[i].c[1]);s.setProperty("--theme-color-3",t[i].c[2]);s.setProperty("--theme-color-bg",t[i].b);s.setProperty("--theme-gradient",t[i].g);s.setProperty("--theme-action-fg",t[i].f);s.setProperty("--theme-action-bg",t[i].ab);break;}}}var mode=localStorage.getItem(m)||"system";var dark=mode==="dark"||(mode==="system"&&window.matchMedia("(prefers-color-scheme: dark)").matches);document.documentElement.classList.toggle("dark",dark);document.documentElement.style.colorScheme=dark?"dark":"light";var tile=dark?"#0b0b0f":(s.getPropertyValue("--theme-action-bg").trim()||"#5f0a87");var glyph=dark?(s.getPropertyValue("--theme-color-3").trim()||"#c77dff"):(s.getPropertyValue("--theme-action-fg").trim()||"#ffffff");var ring=dark?'\u003crect x="2" y="2" width="68" height="68" rx="12" fill="none" stroke="'+glyph+'" stroke-width="3"/>':"";var svg='\u003csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 72 72" width="72" height="72">\u003crect width="72" height="72" rx="14" fill="'+tile+'"/>'+ring+'\u003cpath d="M13 48V23h6l7 10 7-10h6v25h-7V35l-6 9-6-9v13Z" fill="'+glyph+'"/>\u003cpath d="M43 48V23h17v6H50v4h9v6h-9v9Z" fill="'+glyph+'" opacity=".72"/>\u003c/svg>';var lk=document.querySelector('link[rel="icon"]');if(lk){lk.setAttribute("type","image/svg+xml");lk.setAttribute("href","data:image/svg+xml,"+encodeURIComponent(svg));}}catch(e){}})();</script>
80<a href="#main-content" class="skip-link">Skip to content</a>
80<script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"Person","@id":"https://mudasir.in/#person","name":"Mudasir Fayaz","url":"https://mudasir.in","image":"https://mudasir.in/profile_pic.webp","jobTitle":"Frontend Engineer","description":"Mudasir Fayaz is a Frontend Engineer from Kashmir specializing in React, Next.js, Tailwind CSS, and Motion. Building fast, interactive web apps.","sameAs":["https://github.com/Mudasir-Fayaz","https://x.com/mudasirbuilds","https://linkedin.com/in/Mudasir-Fayaz"],"knowsAbout":["React","Next.js","Tailwind CSS","Motion","Supabase","MongoDB"],"address":{"@type":"PostalAddress","addressRegion":"Kashmir","addressCountry":"IN"},"makesOffer":{"@type":"Offer","name":"Freelance Frontend Development","availability":"https://schema.org/InStock"}},{"@type":"WebSite","@id":"https://mudasir.in/#website","url":"https://mudasir.in","name":"Mudasir Fayaz — Frontend Engineer","publisher":{"@id":"https://mudasir.in/#person"}}]}</script>
80<div class="relative min-h-svh py-0 sm:py-5"><div aria-hidden="true" class="dots pointer-events-none fixed inset-0 opacity-50"></div><div class="site-shell relative mx-auto flex min-h-svh flex-col bg-page"><div class="flex flex-1"><div aria-hidden="true" class="rail w-2 shrink-0 border-x border-line sm:w-3.5 lg:w-5"></div><div class="flex min-w-0 flex-1 flex-col"><header class="sticky top-0 z-40 border-b border-line bg-page"><div class="flex h-14 items-center gap-2 px-3 sm:px-5"><a href="/" aria-label="Mudasir Fayaz - Home" class="flex min-w-0 items-center gap-2.5"><svg aria-hidden="true" viewBox="0 0 72 72" class="size-9 shrink-0" fill="none"><rect x="0.5" y="0.5" width="71" height="71" rx="8" class="fill-card stroke-line"></rect><path d="M13 48V23h6l7 10 7-10h6v25h-7V35l-6 9-6-9v13Z" class="fill-foreground"></path><path d="M43 48V23h17v6H50v4h9v6h-9v9Z" class="fill-theme-1"></path><path d="M7 58h58" class="stroke-line-strong"></path></svg><span class="hidden min-w-0 leading-none min-[390px]:block"><span class="block truncate text-sm font-semibold tracking-[-0.02em]">Mudasir Fayaz</span><span class="mt-1 block font-mono text-[9px] uppercase tracking-[0.14em] text-muted-foreground">Frontend Engineer</span></span></a><nav aria-label="Main navigation" class="ml-auto hidden items-center lg:flex"><a href="/projects" class="border-b px-3 py-[1.15rem] text-xs font-medium transition-colors border-transparent text-muted-foreground hover:text-foreground">Projects</a><a href="/components" class="border-b px-3 py-[1.15rem] text-xs font-medium transition-colors border-transparent text-muted-foreground hover:text-foreground">Components</a><a href="/tools" class="border-b px-3 py-[1.15rem] text-xs font-medium transition-colors border-transparent text-muted-foreground hover:text-foreground">Tools</a><a href="/blog" class="border-b px-3 py-[1.15rem] text-xs font-medium transition-colors border-transparent text-muted-foreground hover:text-foreground">Blog</a><details class="group relative"><summary class="flex cursor-pointer list-none items-center gap-1 border-b border-transparent px-3 py-[1.15rem] text-xs font-medium text-muted-foreground hover:text-foreground [&amp;::-webkit-details-marker]:hidden">More <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-down transition-transform group-open:rotate-180" aria-hidden="true"><path d="M6 9l6 6l6 -6"></path></svg></summary><div class="absolute top-full right-0 w-44 border border-line bg-popover p-1.5"><a href="/experience" class="block px-3 py-2 text-xs text-muted-foreground hover:bg-chip hover:text-foreground">Experience</a><a href="/resources" class="block px-3 py-2 text-xs text-muted-foreground hover:bg-chip hover:text-foreground">Resources</a><a href="/inspirations" class="block px-3 py-2 text-xs text-muted-foreground hover:bg-chip hover:text-foreground">Inspirations</a><a href="/contact" class="block px-3 py-2 text-xs text-muted-foreground hover:bg-chip hover:text-foreground">Contact</a></div></details></nav><div class="ml-auto flex items-center gap-1.5 lg:ml-3"><button type="button" aria-haspopup="dialog" aria-label="Search the site" class="inline-flex h-9 items-center gap-2 border border-line bg-card px-2.5 font-mono text-[11px] text-muted-foreground transition-colors hover:border-line-strong hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-search" aria-hidden="true"><path d="M3 10a7 7 0 1 0 14 0a7 7 0 1 0 -14 0"></path><path d="M21 21l-6 -6"></path></svg><span class="hidden sm:inline" aria-hidden="true">Search</span><kbd class="hidden border-l border-line pl-2 text-[10px] text-muted-foreground md:inline">⌘/Ctrl K</kbd></button><dialog aria-labelledby="command-menu-title" class="command-dialog m-auto w-[min(94vw,42rem)] border border-line bg-popover p-0 text-popover-foreground"></dialog><details class="relative">
80<summary aria-label="Choose color mode" title="Choose color mode" class="flex size-9 cursor-pointer list-none items-center justify-center border border-line bg-card text-muted-foreground transition-colors hover:border-line-strong hover:text-foreground [&amp;::-webkit-details-marker]:hidden"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brightness-auto" aria-hidden="true"><path d="M6 6h3.5l2.5 -2.5l2.5 2.5h3.5v3.5l2.5 2.5l-2.5 2.5v3.5h-3.5l-2.5 2.5l-2.5 -2.5h-3.5v-3.5l-2.5 -2.5l2.5 -2.5l0 -3.5"></path><path d="M10 14.5v-3.5a2 2 0 1 1 4 0v3.5"></path><path d="M10 13h4"></path></svg></summary><div aria-label="Color mode" class="absolute top-[calc(100%+0.5rem)] right-0 z-50 w-40 border border-line bg-popover p-1.5 text-popover-foreground"><button type="button" aria-pressed="false" class="flex w-full items-center gap-2 px-2.5 py-2 text-left text-xs text-muted-foreground hover:bg-chip hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brightness-auto" aria-hidden="true"><path d="M6 6h3.5l2.5 -2.5l2.5 2.5h3.5v3.5l2.5 2.5l-2.5 2.5v3.5h-3.5l-2.5 2.5l-2.5 -2.5h-3.5v-3.5l-2.5 -2.5l2.5 -2.5l0 -3.5"></path><path d="M10 14.5v-3.5a2 2 0 1 1 4 0v3.5"></path><path d="M10 13h4"></path></svg><span class="flex-1">System</span></button><button type="button" aria-pressed="false" class="flex w-full items-center gap-2 px-2.5 py-2 text-left text-xs text-muted-foreground hover:bg-chip hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-sun" aria-hidden="true"><path d="M8 12a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path><path d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7"></path></svg><span class="flex-1">Light</span></button><button type="button" aria-pressed="false" class="flex w-full items-center gap-2 px-2.5 py-2 text-left text-xs text-muted-foreground hover:bg-chip hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-moon" aria-hidden="true"><path d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454l0 .008"></path></svg><span class="flex-1">Dark</span></button></div></details><button type="button" aria-haspopup="dialog" aria-label="Open navigation" class="inline-flex size-9 items-center justify-center border border-line bg-card text-muted-foreground hover:border-line-strong hover:text-foreground lg:hidden"><svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-menu-2" aria-hidden="true"><path d="M4 6l16 0"></path><path d="M4 12l16 0"></path><path d="M4 18l16 0"></path></svg></button></div></div><dialog aria-labelledby="mobile-menu-title" class="mobile-nav-dialog m-0 ml-auto h-dvh w-[min(88vw,24rem)] max-w-none border-l border-line bg-page p-0 text-foreground"><div class="flex h-full flex-col"><div class="flex h-14 items-center justify-between border-b border-line px-4"><p id="mobile-menu-title" class="font-mono text-[10px] uppercase tracking-[0.16em] text-muted-foreground">Site index</p><button type="button" aria-label="Close navigation" class="inline-flex size-9 items-center justify-center border border-line text-muted-foreground hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-x" aria-hidden="true"><path d="M18 6l-12 12"></path><path d="M6 6l12 12"></path></svg></button></div><nav aria-label="Mobile navigation" class="flex-1 overflow-y-auto p-3"><a href="/projects" class="grid grid-cols-[2rem_1fr_auto] items-center border-b border-line px-2 py-4 text-sm text-muted-foreground"><span class="font-mono text-[9px] text-theme-1">01</span><span class="font-medium">Projects</span></a><a href="/components" class="grid grid-cols-[2rem_1fr_auto] items-center border-b border-line px-2 py-4 text-sm text-muted-foreground"><span class="font-mono text-[9px] text-theme-1">02</span><span class="font-medium">Components</span></a><a href="/tools" class="grid grid-cols-[2rem_1fr_auto] items-center border-b border-line px-2 py-4 text-sm text-muted-foreground"><span class="font-mono text-[9px] text-theme-1">03</span><span class="font-medium">Tools</span></a><a href="/blog" class="grid grid-cols-[2rem_1fr_auto] items-center border-b border-line px-2 py-4 text-sm text-muted-foreground"><span class="font-mono text-[9px] text-theme-1">04</span><span class="font-medium">Blog</span></a><a href="/experience" class="grid grid-cols-[2rem_1fr_auto] items-center border-b border-line px-2 py-4 text-sm text-muted-foreground"><span class="font-mono text-[9px] text-theme-1">05</span><span class="font-medium">Experience</span></a><a href="/resources" class="grid grid-cols-[2rem_1fr_auto] items-center border-b border-line px-2 py-4 text-sm text-muted-foreground"><span class="font-mono text-[9px] text-theme-1">06</span><span class="font-medium">Resources</span></a><a href="/inspirations" class="grid grid-cols-[2rem_1fr_auto] items-center border-b border-line px-2 py-4 text-sm text-muted-foreground"><span class="font-mono text-[9px] text-theme-1">07</span><span class="font-medium">Inspirations</span></a><a href="/contact" class="grid grid-cols-[2rem_1fr_auto] items-center border-b border-line px-2 py-4 text-sm text-muted-foreground"><span class="font-mono text-[9px] text-theme-1">08</span><span class="font-medium">Contact</span></a></nav><div class="border-t border-line p-4"><a href="/contact" class="theme-action flex h-11 items-center justify-center px-4 text-sm font-semibold">Start a conversation</a></div></div></dialog></header>
80<main id="main-content" class="flex-1"><section id="home" aria-labelledby="home-title"><div class="pointer-pattern "><div aria-hidden="true" class="pointer-pattern-grid"></div><div aria-hidden="true" class="pointer-pattern-cells"></div><div class="relative z-10"><figure aria-labelledby="mf-figure-title" class="relative border-y border-line"><svg viewBox="0 0 640 400" preserveAspectRatio="xMidYMid meet" role="img" class="relative block aspect-[8/5] w-full lg:hidden" aria-labelledby="mf-figure-title mf-figure-description"><title id="mf-figure-title">M F isometric monogram</title><desc id="mf-figure-description">A custom vector monogram for Mudasir Fayaz drawn on a restrained construction grid.</desc><defs><pattern id="mf-hatch" width="10" height="10" patternUnits="userSpaceOnUse" patternTransform="rotate(45)"><path d="M0 0V10" class="stroke-theme-3" stroke-width="3"></path></pattern></defs><g class="stroke-line-strong" fill="none" stroke-width="1.25" stroke-dasharray="6 8" opacity="0.8"><path d="M28 196H612"></path><path d="M320 26V372"></path><path d="M74 288 566 104"></path><path d="M74 104 566 288"></path></g><g transform="translate(320 196) skewX(-15) scale(0.96) translate(-175 -80)"><g transform="translate(18 -16)" class="fill-theme-1" opacity="0.7"><path d="M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z"></path><path d="M200 160V0H350V40H244V66H332V106H244V160Z"></path></g><g transform="translate(9 -8)" class="fill-surface stroke-line-strong" stroke-width="1"><path d="M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z"></path><path d="M200 160V0H350V40H244V66H332V106H244V160Z"></path></g><g class="stroke-foreground" stroke-width="1.6"><path d="M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z" fill="var(--card)"></path><path d="M200 160V0H350V40H244V66H332V106H244V160Z" fill="url(#mf-hatch)"></path></g></g><g class="fill-muted-foreground font-mono text-[11px] tracking-[0.16em]"><text x="28" y="36">FIG. 01 / IDENTITY</text><text x="612" y="36" text-anchor="end">ISOMETRIC / 30°</text><text x="28" y="378">MUDASIR FAYAZ</text><text x="612" y="378" text-anchor="end">MF / 2026</text></g><g class="fill-theme-1"><circle cx="320" cy="196" r="3.5"></circle><circle cx="320" cy="26" r="3"></circle><circle cx="320" cy="372" r="3"></circle><circle cx="74" cy="104" r="3"></circle><circle cx="566" cy="104" r="3"></circle></g></svg><svg viewBox="0 0 1200 340" preserveAspectRatio="xMidYMid meet" role="img" class="relative hidden aspect-[60/17] w-full lg:block" aria-labelledby="mf-figure-title-wide mf-figure-description-wide"><title id="mf-figure-title-wide">M F isometric monogram</title><desc id="mf-figure-description-wide">A wide isometric construction drawing of the Mudasir Fayaz monogram with measurement guides.</desc><defs><pattern id="mf-hatch-wide" width="10" height="10" patternUnits="userSpaceOnUse" patternTransform="rotate(45)"><path d="M0 0V10" class="stroke-theme-3" stroke-width="3"></path></pattern></defs><g class="stroke-line-strong" fill="none" stroke-width="1.25" stroke-dasharray="6 8" opacity="0.8"><path d="M40 170H1160"></path><path d="M600 24V336"></path><path d="M180 262 1020 78"></path><path d="M180 78 1020 262"></path></g><g transform="translate(600 170) skewX(-15) scale(1.02 0.82) translate(-175 -80)"><g transform="translate(20 -18)" class="fill-theme-1" opacity="0.7"><path d="M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z"></path><path d="M200 160V0H350V40H244V66H332V106H244V160Z"></path></g><g transform="translate(10 -9)" class="fill-surface stroke-line-strong" stroke-width="1"><path d="M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z"></path><path d="M200 160V0H350V40H244V66H332V106H244V160Z"></path></g><g class="stroke-foreground" stroke-width="1.6"><path d="M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z" fill="var(--card)"></path><path d="M200 160V0H350V40H244V66H332V106H244V160Z" fill="url(#mf-hatch-wide)"></path></g></g><g class="fill-muted-foreground font-mono text-[11px] tracking-[0.16em]"><text x="40" y="38">FIG. 01 / IDENTITY SYSTEM</text><text x="1160" y="38" text-anchor="end">ISOMETRIC / 30° / SCALE 1:1</text><text x="40" y="316">MUDASIR FAYAZ / FRONTEND ENGINEER</text><text x="1160" y="316" text-anchor="end">MF / 2026</text></g><g class="fill-theme-1"><circle cx="600" cy="170" r="4"></circle><circle cx="600" cy="24" r="3"></circle><circle cx="600" cy="336" r="3"></circle><circle cx="180" cy="78" r="3"></circle><circle cx="1020" cy="78" r="3"></circle><circle cx="180" cy="262" r="3"></circle><circle cx="1020" cy="262" r="3"></circle></g></svg><figcaption class="relative flex items-center justify-between gap-4 border-t border-line px-4 py-2 font-mono text-[10px] uppercase tracking-[0.16em] text-muted-foreground sm:px-5"><span>Monogram study</span><span aria-hidden="true">Construction grid</span></figcaption></figure></div></div><div class="grid border-b border-line lg:grid-cols-[1.18fr_.82fr]"><div class="min-w-0 border-b border-line p-4 sm:p-6 lg:border-r lg:border-b-0"><span class="figure-label">Profile / 01</span><div class="mt-5 flex items-start gap-4 sm:gap-5"><div class="relative size-16 shrink-0 overflow-hidden border border-line sm:size-20"><img src="/_next/image?url=%2Fprofile_pic.webp&amp;w=640&amp;q=75" alt="Mudasir Fayaz" loading="eager" fetchPriority="high" decoding="async" sizes="80px" class="object-cover" data-nimg="fill" style="position:absolute;inset:0;width:100%;height:100%;object-fit:cover"/>
80</div><div class="min-w-0"><h1 id="home-title" class="text-3xl font-semibold tracking-[-0.05em] sm:text-5xl">Mudasir Fayaz</h1><p class="mt-1 font-mono text-[10px] uppercase tracking-[0.16em] text-theme-1 sm:text-xs">Frontend Engineer / Design-minded builder</p></div></div><p class="mt-6 max-w-2xl text-base leading-7 text-muted-foreground sm:text-lg">I build clear, fast interfaces for products that need thoughtful interaction design and production-ready frontend engineering.</p><div class="mt-5 flex flex-wrap gap-2"><a href="/contact" class="theme-action inline-flex h-11 items-center gap-2 px-4 text-sm font-semibold">Let&#x27;s work together<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-up-right" aria-hidden="true"><path d="M17 7l-10 10"></path><path d="M8 7l9 0l0 9"></path></svg></a><a href="mailto:[email protected]" class="inline-flex h-11 items-center gap-2 border border-line bg-card px-4 text-sm font-medium text-muted-foreground hover:border-line-strong hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-mail" aria-hidden="true"><path d="M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10"></path><path d="M3 7l9 6l9 -6"></path></svg>Email me</a></div></div><div class="grid grid-cols-2 content-start"><div class="border-r border-b border-line p-3.5 even:border-r-0 sm:p-4"><p class="font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground">Role</p><p class="mt-2 text-sm font-medium leading-5">Frontend Engineer</p></div><div class="border-r border-b border-line p-3.5 even:border-r-0 sm:p-4"><p class="font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground">Base</p><p class="mt-2 text-sm font-medium leading-5">Kashmir, India</p></div><div class="border-r border-b border-line p-3.5 even:border-r-0 sm:p-4"><p class="font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground">Focus</p><p class="mt-2 text-sm font-medium leading-5">React / Next.js</p></div><div class="border-r border-b border-line p-3.5 even:border-r-0 sm:p-4"><p class="font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground">Archive</p><p class="mt-2 text-sm font-medium leading-5">18 projects</p></div><div class="border-r border-line p-3.5 sm:p-4"><p class="font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground">Local time</p><time class="mt-2 block text-sm font-medium">Asia/Kolkata</time></div><div class="p-3.5 sm:p-4"><p class="font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground">Status</p><p class="mt-2 inline-flex items-center gap-2 text-sm font-medium"><span class="size-1.5 bg-emerald-500" aria-hidden="true"></span>Open to work</p></div></div></div><div class="grid border-b border-line lg:grid-cols-[.82fr_1.18fr]"><div class="min-w-0 border-b border-line p-4 sm:p-6 lg:border-r lg:border-b-0"><span class="figure-label">About / 02</span><p class="mt-3 text-lg leading-7 font-medium tracking-[-0.025em] sm:text-xl sm:leading-8">Building responsive interfaces with a focus on clear systems, useful motion, and dependable delivery.</p></div><div class="p-4 sm:p-6"><div class="flex items-center justify-between gap-4"><span class="figure-label">Working stack</span><a href="https://github.com/Mudasir-Fayaz" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brand-github" aria-hidden="true"><path d="M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5"></path></svg>GitHub</a></div><div class="mt-4 flex flex-wrap gap-2"><span class="border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground">React</span><span class="border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground">Next.js</span><span class="border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground">Tailwind CSS</span><span class="border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground">Motion</span><span class="border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground">Supabase</span><span class="border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground">MongoDB</span></div></div></div><div aria-hidden="true" class="hatched-divider "></div></section><section id="projects" aria-labelledby="selected-work-title" class="border-b border-line"><div class="grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7"><div><span class="figure-label">Projects / 03</span><h2 id="selected-work-title" class="mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl">Selected work</h2><p class="mt-2 max-w-2xl text-sm leading-6 text-muted-foreground">A focused selection from the project archive.</p></div></div><div class="grid gap-3 bg-page p-3 sm:grid-cols-2 sm:p-4 lg:grid-cols-3"><div class="border border-line"><article class="group h-full bg-card p-3 sm:p-4"><a href="https://sjpolyclinics.com" target="_blank" rel="noopener noreferrer" class="flex h-full flex-col"><div class="iso-frame"><span aria-hidden="true" class="iso-frame-plate"></span><div class="iso-frame-media relative aspect-[16/10]"><img src="/_next/image?url=%2Fthumbnails%2Fprojects%2Fsjpolyclinics.webp&amp;w=640&amp;q=75" alt="SJ Polyclinics - project by Mudasir Fayaz" loading="lazy" decoding="async" sizes="(max-width: 640px) 100v
80w, (max-width: 1024px) 50vw, 33vw" class="object-cover" data-nimg="fill" style="position:absolute;inset:0;width:100%;height:100%;object-fit:cover"/><span class="absolute top-3 left-3 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.12em]">Healthcare</span></div></div><div class="flex flex-1 flex-col pt-4"><div class="flex items-start justify-between gap-4"><h3 class="text-base font-semibold tracking-[-0.02em] group-hover:text-theme-1">SJ Polyclinics</h3><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-up-right shrink-0 text-muted-foreground group-hover:text-theme-1" aria-hidden="true"><path d="M17 7l-10 10"></path><path d="M8 7l9 0l0 9"></path></svg></div><p class="mt-2 text-sm leading-6 text-muted-foreground">Polyclinic website with online appointment booking &amp; management features.</p><div class="mt-auto flex flex-wrap gap-1.5 pt-5"><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">ReactJS</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">NextJS</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">Tailwind</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">Motion</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] text-muted-foreground">+<!-- -->1</span></div><span class="mt-5 inline-flex items-center gap-1.5 border-t border-line pt-3 text-xs font-medium">View project <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-up-right" aria-hidden="true"><path d="M17 7l-10 10"></path><path d="M8 7l9 0l0 9"></path></svg></span></div></a></article></div><div class="border border-line"><article class="group h-full bg-card p-3 sm:p-4"><a href="https://medscanbla.com" target="_blank" rel="noopener noreferrer" class="flex h-full flex-col"><div class="iso-frame"><span aria-hidden="true" class="iso-frame-plate"></span><div class="iso-frame-media relative aspect-[16/10]"><img src="/_next/image?url=%2Fthumbnails%2Fprojects%2Fmedscanbla.webp&amp;w=640&amp;q=75" alt="MedScan Ultrasounds - project by Mudasir Fayaz" loading="lazy" decoding="async" sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw" class="object-cover" data-nimg="fill" style="position:absolute;inset:0;width:100%;height:100%;object-fit:cover"/><span class="absolute top-3 left-3 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.12em]">Healthcare</span></div></div><div class="flex flex-1 flex-col pt-4"><div class="flex items-start justify-between gap-4"><h3 class="text-base font-semibold tracking-[-0.02em] group-hover:text-theme-1">MedScan Ultrasounds</h3><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-up-right shrink-0 text-muted-foreground group-hover:text-theme-1" aria-hidden="true"><path d="M17 7l-10 10"></path><path d="M8 7l9 0l0 9"></path></svg></div><p class="mt-2 text-sm leading-6 text-muted-foreground">Landing page of MedScan Ultrasounds — No. 1 Ultrasound Centre in Baramulla.</p><div class="mt-auto flex flex-wrap gap-1.5 pt-5"><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">ReactJS</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">NextJS</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">Tailwind</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">Motion</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] text-muted-foreground">+<!-- -->1</span></div><span class="mt-5 inline-flex items-center gap-1.5 border-t border-line pt-3 text-xs font-medium">View project <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-up-right" aria-hidden="true"><path d="M17 7l-10 10"></path><path d="M8 7l9 0l0 9"></path></svg></span></div></a></article></div><div class="border border-line"><article class="group h-full bg-card p-3 sm:p-4"><a href="https://websuperkit.in" target="_blank" rel="noopener noreferrer" class="flex h-full flex-col"><div class="iso-frame"><span aria-hidden="true" class="iso-frame-plate"></span><div class="iso-frame-media relative aspect-[16/10]"><img src="/_next/image?url=%2Fthumbnails%2Fprojects%2Fsuperkit.webp&amp;w=640&amp;q=75" alt="Web SuperKit - project by Mudasir Fayaz" loading="lazy" decoding="async" sizes="(max-width: 640px) 100v
80w, (max-width: 1024px) 50vw, 33vw" class="object-cover" data-nimg="fill" style="position:absolute;inset:0;width:100%;height:100%;object-fit:cover"/><span class="absolute top-3 left-3 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.12em]">Developer Tool</span></div></div><div class="flex flex-1 flex-col pt-4"><div class="flex items-start justify-between gap-4"><h3 class="text-base font-semibold tracking-[-0.02em] group-hover:text-theme-1">Web SuperKit</h3><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-up-right shrink-0 text-muted-foreground group-hover:text-theme-1" aria-hidden="true"><path d="M17 7l-10 10"></path><path d="M8 7l9 0l0 9"></path></svg></div><p class="mt-2 text-sm leading-6 text-muted-foreground">Web SuperKit — 100+ developer tools in one Chrome extension. All your developer tools in one place.</p><div class="mt-auto flex flex-wrap gap-1.5 pt-5"><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">ReactJS</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">NextJS</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">Tailwind</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground">Motion</span><span class="border border-line bg-page px-2 py-1 font-mono text-[9px] text-muted-foreground">+<!-- -->1</span></div><span class="mt-5 inline-flex items-center gap-1.5 border-t border-line pt-3 text-xs font-medium">View project <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-up-right" aria-hidden="true"><path d="M17 7l-10 10"></path><path d="M8 7l9 0l0 9"></path></svg></span></div></a></article></div></div><a href="/projects" class="group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7"><span class="text-sm font-medium text-foreground">All projects</span><span class="inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground">View all<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5" aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></a><div aria-hidden="true" class="hatched-divider border-t"></div></section><section id="components" aria-labelledby="component-lab-title" class="border-b border-line"><div class="grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7"><div><span class="figure-label">Components / 04</span><h2 id="component-lab-title" class="mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl">Component lab</h2><p class="mt-2 max-w-2xl text-sm leading-6 text-muted-foreground">React components with live previews and copyable source.</p></div></div><div class="grid gap-px bg-line sm:grid-cols-2 lg:grid-cols-3"><a href="/components/animated-button" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-code" aria-hidden="true"><path d="M7 8l-4 4l4 4"></path><path d="M17 8l4 4l-4 4"></path><path d="M14 4l-4 16"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Animated Button</span></a><a href="/components/feature-card" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-code" aria-hidden="true"><path d="M7 8l-4 4l4 4"></path><path d="M17 8l4 4l-4 4"></path><path d="M14 4l-4 16"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Feature Card</span></a><a href="/components/testimonial-card" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-code" aria-hidden="true"><path d="M7 8l-4 4l4 4"></path><path d="M17 8l4 4l-4 4"></path><path d="M14 4l-4 16"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Testimonial Card</span></a><a href="/components/pricing-card" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-code" aria-hidden="true"><path d="M7 8l-4 4l4 4"></path><path d="M17 8l4 4l-4 4"></path><path d="M14 4l-4 16"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Pricing Card</span></a><a href="/components/progress-bar" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-code" aria-hidden="true"><path d="M7 8l-4 4l4 4"></path><path d="M17 8l4 4l-4 4"></path><path d="M14 4l-4 16"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Progress Bar</span></a><a href="/components/notification-toast" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-code" aria-hidden="true"><path d="M7 8l-4 4l4 4"></path><path d="M17 8l4 4l-4 4"></path><path d="M14 4l-4 16"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Notification Toast</span></a></div><a href="/components" class="group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7"><span class="text-sm font-medium text-foreground">All components</span><span class="inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground">View all<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5" aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></a></section><section id="tools" aria-labelledby="utility-tools-title" class="border-b border-line"><div class="grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7"><div><span class="figure-label">Tools / 05</span><h2 id="utility-tools-title" class="mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl">Utility tools</h2><p class="mt-2 max-w-2xl text-sm leading-6 text-muted-foreground">Browser tools for everyday frontend work.</p></div></div><div class="grid gap-px bg-line sm:grid-cols-2 lg:grid-cols-3"><a href="/tools/color-picker" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-palette" aria-hidden="true"><path d="M12 21a9 9 0 0 1 0 -18c4.97 0 9 3.582 9 8c0 1.06 -.474 2.078 -1.318 2.828c-.844 .75 -1.989 1.172 -3.182 1.172h-2.5a2 2 0 0 0 -1 3.75a1.3 1.3 0 0 1 -1 2.25"></path><path d="M7.5 10.5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M11.5 7.5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M15.5 10.5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">
80Color Picker</span></a><a href="/tools/contrast-checker" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-contrast" aria-hidden="true"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M12 17a5 5 0 0 0 0 -10v10"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Contrast Checker</span></a><a href="/tools/gradient-generator" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-gradienter" aria-hidden="true"><path d="M3.227 14c.917 4 4.497 7 8.773 7c4.277 0 7.858 -3 8.773 -7"></path><path d="M20.78 10a9 9 0 0 0 -8.78 -7a8.985 8.985 0 0 0 -8.782 7"></path><path d="M10 12a2 2 0 1 0 4 0a2 2 0 1 0 -4 0"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Gradient Generator</span></a><a href="/tools/shadow-generator" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-stack-2" aria-hidden="true"><path d="M12 4l-8 4l8 4l8 -4l-8 -4"></path><path d="M4 12l8 4l8 -4"></path><path d="M4 16l8 4l8 -4"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Shadow Generator</span></a><a href="/tools/unit-converter" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-ruler-measure" aria-hidden="true">
80<path d="M19.875 12c.621 0 1.125 .512 1.125 1.143v5.714c0 .631 -.504 1.143 -1.125 1.143h-15.875a1 1 0 0 1 -1 -1v-5.857c0 -.631 .504 -1.143 1.125 -1.143h15.75"></path><path d="M9 12v2"></path><path d="M6 12v3"></path><path d="M12 12v3"></path><path d="M18 12v3"></path><path d="M15 12v2"></path><path d="M3 3v4"></path><path d="M3 5h18"></path><path d="M21 3v4"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Unit Converter</span></a><a href="/tools/word-counter" class="group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip"><span class="theme-action inline-flex size-8 shrink-0 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-file-text" aria-hidden="true"><path d="M14 3v4a1 1 0 0 0 1 1h4"></path><path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2"></path><path d="M9 9l1 0"></path><path d="M9 13l6 0"></path><path d="M9 17l6 0"></path></svg></span><span class="min-w-0 truncate text-sm font-medium group-hover:text-theme-1">Word Counter</span></a></div><a href="/tools" class="group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7"><span class="text-sm font-medium text-foreground">All tools</span><span class="inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground">View all<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5" aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></a></section><section id="blog" aria-labelledby="writing-title" class="border-b border-line"><div class="grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7"><div><span class="figure-label">Writing / 06</span><h2 id="writing-title" class="mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl">Notes</h2><p class="mt-2 max-w-2xl text-sm leading-6 text-muted-foreground">Short writing on frontend systems and performance.</p></div></div><div class="grid gap-px bg-line sm:grid-cols-2 lg:grid-cols-3"><article class="group h-full bg-card p-3 sm:p-4"><a href="/blog/serverless-file-uploads-with-supabase-storage-and-nextjs-api-routes" class="flex h-full flex-col"><div class="iso-frame"><span aria-hidden="true" class="iso-frame-plate"></span><div class="iso-frame-media relative aspect-[16/9]"><img src="/_next/image?url=%2Fthumbnails%2Fblog%2Fserverless-file-uploads-with-supabase-storage-and-nextjs-api-routes.webp&amp;w=640&amp;q=75" alt="" loading="lazy" decoding="async" sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw" class="object-cover" data-nimg="fill" style="position:absolute;inset:0;width:100%;height:100%;object-fit:cover"/></div></div><div class="flex flex-1 flex-col pt-4"><div class="flex flex-wrap items-center justify-between gap-3 font-mono text-[9px] uppercase tracking-[0.1em] text-muted-foreground"><span class="flex flex-wrap items-center gap-3"><time>02 Oct 2025</time><span class="inline-flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-clock" aria-hidden="true"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0"></path><path d="M12 7v5l3 3"></path></svg>1<!-- --> min</span></span><span>NOTE-<!-- -->01</span></div><h3 class="mt-4 text-base font-semibold leading-6 tracking-[-0.02em] group-hover:text-theme-1">Serverless file uploads with Supabase Storage and Next.js API routes</h3><p class="mt-2 line-clamp-2 text-xs leading-5 text-muted-foreground">Secure, serverless file uploads in Next.js using Supabase Storage, with validation, size limits, and public access handling.</p><div class="mt-4 flex items-center gap-1.5 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground"><span class="border border-line bg-page px-2 py-1">next.js</span><span>+<!-- -->3</span></div><span class="mt-auto flex items-center gap-1.5 pt-5 text-xs font-medium">
80Read note <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right" aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></div></a></article><article class="group h-full bg-card p-3 sm:p-4"><a href="/blog/building-modern-todo-app-with-zustand-firebase-and-nextjs" class="flex h-full flex-col"><div class="iso-frame"><span aria-hidden="true" class="iso-frame-plate"></span><div class="iso-frame-media relative aspect-[16/9]"><img src="/_next/image?url=%2Fthumbnails%2Fblog%2Fbuilding-modern-todo-app-with-zustand-firebase-and-nextjs.webp&amp;w=640&amp;q=75" alt="" loading="lazy" decoding="async" sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw" class="object-cover" data-nimg="fill" style="position:absolute;inset:0;width:100%;height:100%;object-fit:cover"/></div></div><div class="flex flex-1 flex-col pt-4"><div class="flex flex-wrap items-center justify-between gap-3 font-mono text-[9px] uppercase tracking-[0.1em] text-muted-foreground"><span class="flex flex-wrap items-center gap-3"><time>01 Oct 2025</time><span class="inline-flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-clock" aria-hidden="true"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0"></path><path d="M12 7v5l3 3"></path></svg>1<!-- --> min</span></span><span>NOTE-<!-- -->02</span></div><h3 class="mt-4 text-base font-semibold leading-6 tracking-[-0.02em] group-hover:text-theme-1">Building a modern todo app with Zustand, Firebase, and Next.js</h3><p class="mt-2 line-clamp-2 text-xs leading-5 text-muted-foreground">A real-time todo app with authentication, CRUD operations, and predictable global state, built with Next.js, Firebase, and Zustand.</p><div class="mt-4 flex items-center gap-1.5 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground"><span class="border border-line bg-page px-2 py-1">next.js</span><span>+<!-- -->3</span></div><span class="mt-auto flex items-center gap-1.5 pt-5 text-xs font-medium">
80Read note <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right" aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></div></a></article><article class="group h-full bg-card p-3 sm:p-4"><a href="/blog/integrating-razorpay-payments-in-nextjs-step-by-step-guide-for-developers" class="flex h-full flex-col"><div class="iso-frame"><span aria-hidden="true" class="iso-frame-plate"></span><div class="iso-frame-media relative aspect-[16/9]"><img src="/_next/image?url=%2Fthumbnails%2Fblog%2Fintegrating-razorpay-payments-in-nextjs-step-by-step-guide-for-developers.webp&amp;w=640&amp;q=75" alt="" loading="lazy" decoding="async" sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw" class="object-cover" data-nimg="fill" style="position:absolute;inset:0;width:100%;height:100%;object-fit:cover"/></div></div><div class="flex flex-1 flex-col pt-4"><div class="flex flex-wrap items-center justify-between gap-3 font-mono text-[9px] uppercase tracking-[0.1em] text-muted-foreground"><span class="flex flex-wrap items-center gap-3"><time>30 Sept 2025</time><span class="inline-flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-clock" aria-hidden="true"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0"></path><path d="M12 7v5l3 3"></path></svg>1<!-- --> min</span></span><span>NOTE-<!-- -->03</span></div><h3 class="mt-4 text-base font-semibold leading-6 tracking-[-0.02em] group-hover:text-theme-1">Integrating Razorpay payments in Next.js: a step-by-step guide</h3><p class="mt-2 line-clamp-2 text-xs leading-5 text-muted-foreground">Set up checkout, verify signatures on the server, and handle webhooks safely when integrating Razorpay with Next.js.</p><div class="mt-4 flex items-center gap-1.5 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground"><span class="border border-line bg-page px-2 py-1">next.js</span><span>+<!-- -->3</span></div><span class="mt-auto flex items-center gap-1.5 pt-5 text-xs font-medium">
80Read note <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right" aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></div></a></article></div><a href="/blog" class="group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7"><span class="text-sm font-medium text-foreground">All writing</span><span class="inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground">View all<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5" aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></a></section><section id="experience" aria-labelledby="experience-title" class="border-b border-line"><div class="grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7"><div><span class="figure-label">Experience / 07</span><h2 id="experience-title" class="mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl">Experience</h2><p class="mt-2 max-w-2xl text-sm leading-6 text-muted-foreground">Recent engagements and products, newest first.</p></div></div><div class="px-4 py-6 sm:px-7 sm:py-8"><ol class="relative"><li class="relative pl-6 sm:pl-10 pb-5 sm:pb-6"><span aria-hidden="true" class="absolute top-9 bottom-0 left-[3px] w-px bg-line"></span><span aria-hidden="true" class="absolute top-[30px] left-0 size-[7px] bg-theme-1"></span><article class="border border-line bg-card p-4 sm:p-5"><div class="flex items-start justify-between gap-4"><div class="min-w-0"><h3 class="text-base font-semibold tracking-[-0.02em] sm:text-lg"><a href="https://sjpolyclinics.com" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 hover:text-theme-1">SJ Polyclinics<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-external-link" aria-hidden="true"><path d="M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6"></path><path d="M11 13l9 -9"></path><path d="M15 4h5v5"></path></svg></a></h3><p class="mt-1.5 inline-flex items-center gap-1.5 font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-map-pin" aria-hidden="true"><path d="M9 11a3 3 0 1 0 6 0a3 3 0 0 0 -6 0"></path><path d="M17.657 16.657l-4.243 4.243a2 2 0 0 1 -2.827 0l-4.244 -4.243a8 8 0 1 1 11.314 0"></path></svg>Kashmir, India</p></div><span aria-hidden="true" class="flex size-11 shrink-0 items-center justify-center border border-line bg-chip font-mono text-xs font-semibold text-foreground sm:size-12">SJ</span></div><div class="mt-4 flex flex-wrap items-center gap-x-3 gap-y-2"><span class="border border-line bg-chip px-2 py-0.5 font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground">Freelance</span><p class="inline-flex items-center gap-2 text-sm font-medium"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-briefcase shrink-0 text-theme-1" aria-hidden="true"><path d="M3 9a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v9a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2l0 -9"></path><path d="M8 7v-2a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v2"></path><path d="M12 12l0 .01"></path><path d="M3 13a20 20 0 0 0 18 0"></path></svg>
80Frontend Engineer</p></div><p class="mt-2 inline-flex items-center gap-2 font-mono text-xs text-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-calendar" aria-hidden="true"><path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12"></path><path d="M16 3v4"></path><path d="M8 3v4"></path><path d="M4 11h16"></path><path d="M11 15h1"></path><path d="M12 15v3"></path></svg><time dateTime="2026-03-20">20 Mar 2026</time></p><p class="mt-3 text-sm leading-6 text-muted-foreground">A polyclinic website with online appointment booking and clinic management.</p><ul class="mt-4 space-y-2"><li class="flex gap-2.5 text-sm leading-6 text-muted-foreground"><span aria-hidden="true" class="mt-2.5 size-1 shrink-0 bg-theme-1"></span><span class="min-w-0">Built the patient-facing website with a clear service structure</span></li><li class="flex gap-2.5 text-sm leading-6 text-muted-foreground"><span aria-hidden="true" class="mt-2.5 size-1 shrink-0 bg-theme-1"></span><span class="min-w-0">Implemented online appointment booking and request handling</span></li><li class="flex gap-2.5 text-sm leading-6 text-muted-foreground"><span aria-hidden="true" class="mt-2.5 size-1 shrink-0 bg-theme-1"></span><span class="min-w-0">Connected the frontend to a Supabase data layer for staff workflows</span></li></ul><div class="no-scrollbar mt-4 flex items-center gap-1.5 overflow-x-auto border-t border-line pt-4"><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">ReactJS</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">NextJS</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">Tailwind</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">Motion</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">Supabase</span></div></article></li><li class="relative pl-6 sm:pl-10 pb-5 sm:pb-6"><span aria-hidden="true" class="absolute top-9 bottom-0 left-[3px] w-px bg-line"></span><span aria-hidden="true" class="absolute top-[30px] left-0 size-[7px] bg-theme-1"></span><article class="border border-line bg-card p-4 sm:p-5"><div class="flex items-start justify-between gap-4"><div class="min-w-0"><h3 class="text-base font-semibold tracking-[-0.02em] sm:text-lg"><a href="https://medvuelabs.pages.dev" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 hover:text-theme-1">Medvue Healthlabs<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-external-link" aria-hidden="true"><path d="M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6"></path><path d="M11 13l9 -9"></path><path d="M15 4h5v5"></path></svg></a></h3><p class="mt-1.5 inline-flex items-center gap-1.5 font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-map-pin" aria-hidden="true"><path d="M9 11a3 3 0 1 0 6 0a3 3 0 0 0 -6 0"></path><path d="M17.657 16.657l-4.243 4.243a2 2 0 0 1 -2.827 0l-4.244 -4.243a8 8 0 1 1 11.314 0"></path></svg>Remote</p></div><span aria-hidden="true" class="flex size-11 shrink-0 items-center justify-center border border-line bg-chip font-mono text-xs font-semibold text-foreground sm:size-12">MH</span></div><div class="mt-4 flex flex-wrap items-center gap-x-3 gap-y-2"><span class="border border-line bg-chip px-2 py-0.5 font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground">Freelance</span><p class="inline-flex items-center gap-2 text-sm font-medium"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-briefcase shrink-0 text-theme-1" aria-hidden="true"><path d="M3 9a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v9a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2l0 -9"></path><path d="M8 7v-2a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v2"></path><path d="M12 12l0 .01"></path><path d="M3 13a20 20 0 0 0 18 0"></path></svg>
80Frontend Engineer</p></div><p class="mt-2 inline-flex items-center gap-2 font-mono text-xs text-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-calendar" aria-hidden="true"><path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12"></path><path d="M16 3v4"></path><path d="M8 3v4"></path><path d="M4 11h16"></path><path d="M11 15h1"></path><path d="M12 15v3"></path></svg><time dateTime="2025-09-02">2 Sept 2025</time></p><p class="mt-3 text-sm leading-6 text-muted-foreground">A healthlab landing page with online lab-test booking.</p><ul class="mt-4 space-y-2"><li class="flex gap-2.5 text-sm leading-6 text-muted-foreground"><span aria-hidden="true" class="mt-2.5 size-1 shrink-0 bg-theme-1"></span><span class="min-w-0">Built the landing page and test catalogue layout</span></li><li class="flex gap-2.5 text-sm leading-6 text-muted-foreground"><span aria-hidden="true" class="mt-2.5 size-1 shrink-0 bg-theme-1"></span><span class="min-w-0">Implemented the online lab-test booking entry points</span></li><li class="flex gap-2.5 text-sm leading-6 text-muted-foreground"><span aria-hidden="true" class="mt-2.5 size-1 shrink-0 bg-theme-1"></span><span class="min-w-0">Tuned the page for fast first load and mobile visitors</span></li></ul><div class="no-scrollbar mt-4 flex items-center gap-1.5 overflow-x-auto border-t border-line pt-4"><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">ReactJS</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">NextJS</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">Tailwind</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">Motion</span></div></article></li><li class="relative pl-6 sm:pl-10 "><span aria-hidden="true" class="absolute top-[30px] left-0 size-[7px] bg-theme-1"></span><article class="border border-line bg-card p-4 sm:p-5"><div class="flex items-start justify-between gap-4"><div class="min-w-0"><h3 class="text-base font-semibold tracking-[-0.02em] sm:text-lg">TRTS</h3><p class="mt-1.5 inline-flex items-center gap-1.5 font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-map-pin" aria-hidden="true"><path d="M9 11a3 3 0 1 0 6 0a3 3 0 0 0 -6 0"></path><path d="M17.657 16.657l-4.243 4.243a2 2 0 0 1 -2.827 0l-4.244 -4.243a8 8 0 1 1 11.314 0"></path></svg>Kashmir, India</p></div><span aria-hidden="true" class="flex size-11 shrink-0 items-center justify-center border border-line bg-chip font-mono text-xs font-semibold text-foreground sm:size-12">TR</span></div><div class="mt-4 flex flex-wrap items-center gap-x-3 gap-y-2"><span class="border border-line bg-chip px-2 py-0.5 font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground">Full-time</span><p class="inline-flex items-center gap-2 text-sm font-medium"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-briefcase shrink-0 text-theme-1" aria-hidden="true"><path d="M3 9a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v9a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2l0 -9"></path><path d="M8 7v-2a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v2"></path><path d="M12 12l0 .01"></path><path d="M3 13a20 20 0 0 0 18 0"></path></svg>Senior Developer</p></div><p class="mt-2 inline-flex items-center gap-2 font-mono text-xs text-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-calendar" aria-hidden="true"><path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12"></path><path d="M16 3v4"></path><path d="M8 3v4"></path><path d="M4 11h16"></path><path d="M11 15h1"></path><path d="M12 15v3"></path></svg><time dateTime="2025-05-16">16 May 2025</time></p><p class="mt-3 text-sm leading-6 text-muted-foreground">Senior developer role building and maintaining frontend products for the company.</p><ul class="mt-4 space-y-2"><li class="flex gap-2.5 text-sm leading-6 text-muted-foreground"><span aria-hidden="true" class="mt-2.5 size-1 shrink-0 bg-theme-1"></span><span class="min-w-0">Lead frontend development across the company&#x27;s web products</span></li><li class="flex gap-2.5 text-sm leading-6 text-muted-foreground"><span aria-hidden="true" class="mt-2.5 size-1 shrink-0 bg-theme-1"></span><span class="min-w-0">Build and maintain reusable interface systems and components</span></li><li class="flex gap-2.5 text-sm leading-6 text-muted-foreground"><span aria-hidden="true" class="mt-2.5 size-1 shrink-0 bg-theme-1"></span><span class="min-w-0">Review work and raise the bar on performance and accessibility</span></li></ul><div class="no-scrollbar mt-4 flex items-center gap-1.5 overflow-x-auto border-t border-line pt-4"><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">ReactJS</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">NextJS</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">Tailwind</span><span class="shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground">Motion</span></div></article></li></ol></div><a href="/experience" class="group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7"><span class="text-sm font-medium text-foreground">Full timeline</span><span class="inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground">View all<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5" aria-hidden="true"><path d="M5 12l14 0"></path><path d="M13 18l6 -6"></path><path d="M13 6l6 6"></path></svg></span></a></section><section id="testimonials" aria-labelledby="testimonials-title" class="border-b border-line"><div class="grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7"><div><span class="figure-label">References / 08</span><h2 id="testimonials-title" class="mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl">Client notes</h2><p class="mt-2 max-w-2xl text-sm leading-6 text-muted-foreground">Words from the people I have built with.</p></div></div><div class="grid gap-px bg-line md:grid-cols-2"><figure class="flex min-h-56 flex-col bg-card p-5 sm:p-6"><div class="flex items-center justify-between gap-4 font-mono text-[9px] uppercase tracking-[0.14em] text-muted-foreground"><span>Note <!-- -->01</span><span aria-hidden="true">“</span></div><blockquote class="mt-5 text-base leading-7 text-foreground">Mudasir built a visually stunning and functional website for our institute. His design sense and execution truly exceeded our expectations.</blockquote><figcaption class="mt-auto flex items-center gap-3 pt-6"><img src="/_next/image?url=%2Fthumbnails%2Ftestmonials%2Fwasim.webp&amp;w=96&amp;q=75" alt="" width="40" height="40" loading="lazy" decoding="async" srcSet="/_next/image?url=%2Fthumbnails%2Ftestmonials%2Fwasim.webp&amp;w=48&amp;q=75 1x, /_next/image?url=%2Fthumbnails%2Ftestmonials%2Fwasim.webp&amp;w=96&amp;q=75 2x" class="size-10 border border-line object-cover" data-nimg="1"/><span><strong class="block text-sm font-semibold">Wasim Raja</strong><span class="block text-xs text-muted-foreground">Founder, ACIT</span></span></figcaption></figure><figure class="flex min-h-56 flex-col bg-card p-5 sm:p-6"><div class="flex items-center justify-between gap-4 font-mono text-[9px] uppercase tracking-[0.14em] text-muted-foreground"><span>Note <!-- -->02</span><span aria-hidden="true">“</span></div><blockquote class="mt-5 text-base leading-7 text-foreground">Mudasir created an amazing landing page and management panel for our clinic. It handles data for 100+ patients daily with ease and reliability.</blockquote><figcaption class="mt-auto flex items-center gap-3 pt-6"><img src="/_next/image?url=%2Fthumbnails%2Ftestmonials%2Fbilal.webp&amp;w=96&amp;q=75" alt="" width="40" height="40" loading="lazy" decoding="async" srcSet="/_next/image?url=%2Fthumbnails%2Ftestmonials%2Fbilal.webp&amp;w=48&amp;q=75 1x, /_next/image?url=%2Fthumbnails%2Ftestmonials%2Fbilal.webp&amp;w=96&amp;q=75 2x" class="size-10 border border-line object-cover" data-nimg="1"/><span><strong class="block text-sm font-semibold">Bilal Dar</strong><span class="block text-xs text-muted-foreground">MedScan Ultrasounds</span></span></figcaption></figure><figure class="flex min-h-56 flex-col bg-card p-5 sm:p-6"><div class="flex items-center justify-between gap-4 font-mono text-[9px] uppercase tracking-[0.14em] text-muted-foreground"><span>Note <!-- -->03</span><span aria-hidden="true">“</span></div><blockquote class="mt-5 text-base leading-7 text-foreground">Working with Mudasir transformed our workflow. His automation tools and subscription platforms save us hours of work every day.</blockquote><figcaption class="mt-auto flex items-center gap-3 pt-6"><img src="/_next/image?url=%2Fthumbnails%2Ftestmonials%2Ftahir.webp&amp;w=96&amp;q=75" alt="" width="40" height="40" loading="lazy" decoding="async" srcSet="/_next/image?url=%2Fthumbnails%2Ftestmonials%2Ftahir.webp&amp;w=48&amp;q=75 1x, /_next/image?url=%2Fthumbnails%2Ftestmonials%2Ftahir.webp&amp;w=96&amp;q=75 2x" class="size-10 border border-line object-cover" data-nimg="1"/><span><strong class="block text-sm font-semibold">Dr Tahir Rufayee</strong><span class="block text-xs text-muted-foreground">CEO, TRTS</span></span></figcaption></figure><figure class="flex min-h-56 flex-col bg-card p-5 sm:p-6"><div class="flex items-center justify-between gap-4 font-mono text-[9px] uppercase tracking-[0.14em] text-muted-foreground"><span>Note <!-- -->04</span><span aria-hidden="true">“</span></div><blockquote class="mt-5 text-base leading-7 text-foreground">Mudasir&#x27;s landing page designs are modern, responsive, and beautifully interactive. He&#x27;s consistently delivered outstanding websites for my clients.</blockquote><figcaption class="mt-auto flex items-center gap-3 pt-6"><img src="/_next/image?url=%2Fthumbnails%2Ftestmonials%2Fnaveed.webp&amp;w=96&amp;q=75" alt="" width="40" height="40" loading="lazy" decoding="async" srcSet="/_next/image?url=%2Fthumbnails%2Ftestmonials%2Fnaveed.webp&amp;w=48&amp;q=75 1x, /_next/image?url=%2Fthumbnails%2Ftestmonials%2Fnaveed.webp&amp;w=96&amp;q=75 2x" class="size-10 border border-line object-cover" data-nimg="1"/><span><strong class="block text-sm font-semibold">Naveed Khan</strong><span class="block text-xs text-muted-foreground">
80Founder, Fubll Softwares</span></span></figcaption></figure></div></section><section id="contact" class="section-inset border-t border-line px-4 py-8 sm:py-10"><div class="mx-auto max-w-2xl text-center"><h2 class="text-2xl font-bold tracking-tight sm:text-3xl">Get in touch</h2><p class="mx-auto mt-2 max-w-xl text-sm leading-relaxed text-muted-foreground">I&#x27;m currently looking for new opportunities. Whether you have a question or want to say hi, hit that button.</p><form class="mx-auto mt-5 flex max-w-md flex-col gap-2 sm:flex-row"><input type="email" data-slot="input" class="flex w-full min-w-0 rounded-md border border-input bg-background px-3 py-1 text-sm shadow-xs transition-[color,box-shadow,border-color] outline-none placeholder:text-muted-foreground focus-visible:border-theme-1 focus-visible:ring-2 focus-visible:ring-theme-1/25 disabled:cursor-not-allowed disabled:opacity-50 file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium h-11" required="" placeholder="Your email" aria-label="Your email" value=""/><input type="text" tabindex="-1" autoComplete="off" class="hidden" aria-hidden="true" name="company" value=""/><button type="submit" class="theme-action inline-flex h-11 shrink-0 items-center justify-center gap-2 px-5 text-sm font-semibold disabled:cursor-not-allowed disabled:opacity-70"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-send" aria-hidden="true"><path d="M10 14l11 -11"></path><path d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5"></path></svg>Send Enquiry</button></form></div></section></main></div><div aria-hidden="true" class="rail w-2 shrink-0 border-x border-line sm:w-3.5 lg:w-5"></div></div><footer class="border-x border-t border-line bg-page"><div class="grid border-b border-line lg:grid-cols-[1.15fr_.85fr]"><div class="border-b border-line p-5 sm:p-7 lg:border-r lg:border-b-0"><svg aria-hidden="true" viewBox="0 0 72 72" class="size-11" fill="none"><rect x="0.5" y="0.5" width="71" height="71" rx="8" class="fill-card stroke-line"></rect><path d="M13 48V23h6l7 10 7-10h6v25h-7V35l-6 9-6-9v13Z" class="fill-foreground"></path><path d="M43 48V23h17v6H50v4h9v6h-9v9Z" class="fill-theme-1"></path><path d="M7 58h58" class="stroke-line-strong"></path></svg><p class="mt-5 max-w-xl text-2xl font-semibold tracking-[-0.04em] sm:text-3xl">Have a product interface that needs a careful frontend build?</p><p class="mt-3 max-w-lg text-sm leading-6 text-muted-foreground">I am available for freelance and remote projects, from focused landing pages to interactive product experiences.</p><a href="/contact" class="theme-action mt-6 inline-flex h-11 items-center gap-2 px-4 text-sm font-semibold">Start a conversation<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrow-up-right" aria-hidden="true"><path d="M17 7l-10 10"></path><path d="M8 7l9 0l0 9"></path></svg></a></div><div class="grid grid-cols-2 sm:grid-cols-3"><nav aria-label="Work links" class="border-r border-line p-5 last:border-r-0 sm:p-6"><p class="font-mono text-[9px] uppercase tracking-[0.18em] text-muted-foreground">Work</p><div class="mt-4 grid gap-3"><a href="/projects" class="w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline">Projects</a><a href="/components" class="w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline">Components</a><a href="/tools" class="w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline">Tools</a></div></nav><nav aria-label="Explore links" class="border-r border-line p-5 last:border-r-0 sm:p-6"><p class="font-mono text-[9px] uppercase tracking-[0.18em] text-muted-foreground">Explore</p><div class="mt-4 grid gap-3"><a href="/blog" class="w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline">Blog</a><a href="/experience" class="w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline">Experience</a><a href="/resources" class="w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline">Resources</a></div></nav><nav aria-label="Connect links" class="border-r border-line p-5 last:border-r-0 sm:p-6"><p class="font-mono text-[9px] uppercase tracking-[0.18em] text-muted-foreground">Connect</p><div class="mt-4 grid gap-3"><a href="/inspirations" class="w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline">Inspirations</a></div></nav></div></div><div class="pointer-pattern border-b border-line px-4 py-7 sm:py-9">
80<div aria-hidden="true" class="pointer-pattern-grid"></div><div aria-hidden="true" class="pointer-pattern-cells"></div><div class="relative z-10"><p class="iso-title text-[clamp(2.25rem,9vw,5.5rem)]"><span aria-hidden="true" class="iso-title-layer iso-title-back">Mudasir Fayaz</span><span aria-hidden="true" class="iso-title-layer iso-title-mid">Mudasir Fayaz</span><span class="iso-title-layer iso-title-front">Mudasir Fayaz</span></p></div></div><div class="grid gap-px bg-line sm:grid-cols-[1fr_auto_1fr]"><div class="flex flex-wrap items-center gap-x-4 gap-y-2 bg-page px-4 py-3 font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground"><span class="inline-flex items-center gap-2"><span class="size-1.5 bg-emerald-500" aria-hidden="true"></span>Available for work</span><time class="">Asia/Kolkata</time></div><div class="flex items-center justify-center gap-1 bg-page px-4 py-2"><a href="https://github.com/Mudasir-Fayaz" aria-label="GitHub" target="_blank" rel="noopener noreferrer" class="inline-flex size-8 items-center justify-center text-muted-foreground hover:bg-chip hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brand-github" aria-hidden="true"><path d="M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5"></path></svg></a><a href="https://linkedin.com/in/Mudasir-Fayaz" aria-label="LinkedIn" target="_blank" rel="noopener noreferrer" class="inline-flex size-8 items-center justify-center text-muted-foreground hover:bg-chip hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brand-linkedin" aria-hidden="true"><path d="M8 11v5"></path><path d="M8 8v.01"></path><path d="M12 16v-5"></path><path d="M16 16v-3a2 2 0 1 0 -4 0"></path><path d="M3 7a4 4 0 0 1 4 -4h10a4 4 0 0 1 4 4v10a4 4 0 0 1 -4 4h-10a4 4 0 0 1 -4 -4l0 -10"></path></svg></a><a href="https://x.com/mudasirbuilds" aria-label="X" target="_blank" rel="noopener noreferrer" class="inline-flex size-8 items-center justify-center text-muted-foreground hover:bg-chip hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brand-x" aria-hidden="true"><path d="M4 4l11.733 16h4.267l-11.733 -16l-4.267 0"></path><path d="M4 20l6.768 -6.768m2.46 -2.46l6.772 -6.772"></path></svg></a><a href="mailto:[email protected]" aria-label="Email" class="inline-flex size-8 items-center justify-center text-muted-foreground hover:bg-chip hover:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-mail" aria-hidden="true"><path d="M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10"></path><path d="M3 7l9 6l9 -6"></path></svg></a></div><p class="bg-page px-4 py-3 text-right font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground">Next.js / vinext / Cloudflare / <!-- -->2026</p></div></footer></div></div><div class="floating-dock fixed bottom-[calc(0.75rem+env(safe-area-inset-bottom))] z-40 flex flex-col gap-3"><button type="button" class="iso-fab size-11 outline-offset-4" aria-label="Change accent color" aria-haspopup="dialog" title="Accent colors"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-palette" aria-hidden="true"><path d="M12 21a9 9 0 0 1 0 -18c4.97 0 9 3.582 9 8c0 1.06 -.474 2.078 -1.318 2.828c-.844 .75 -1.989 1.172 -3.182 1.172h-2.5a2 2 0 0 0 -1 3.75a1.3 1.3 0 0 1 -1 2.25"></path><path d="M7.5 10.5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M11.5 7.5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M15.5 10.5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg></button><button type="button" class="iso-fab size-11 outline-offset-4" aria-label="Show a random quote" aria-haspopup="dialog" title="Random quote"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-quote" aria-hidden="true"><path d="M10 11h-4a1 1 0 0 1 -1 -1v-3a1 1 0 0 1 1 -1h3a1 1 0 0 1 1 1v6c0 2.667 -1.333 4.333 -4 5"></path><path d="M19 11h-4a1 1 0 0 1 -1 -1v-3a1 1 0 0 1 1 -1h3a1 1 0 0 1 1 1v6c0 2.667 -1.333 4.333 -4 5"></path></svg></button><button type="button" class="iso-fab size-11 outline-offset-4" aria-label="Chat with Mudasir&#x27;s assistant" aria-haspopup="dialog" aria-expanded="false" title="Open assistant"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-message-chatbot" aria-hidden="true"><path d="M18 4a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-5l-5 3v-3h-2a3 3 0 0 1 -3 -3v-8a3 3 0 0 1 3 -3h12"></path><path d="M9.5 9h.01"></path><path d="M14.5 9h.01"></path><path d="M9.5 13a3.5 3.5 0 0 0 5 0"></path></svg></button></div><dialog aria-labelledby="_R_eki_" aria-describedby="_R_ekiH1_" class="technical-dialog m-auto max-h-[calc(100dvh-2rem)] w-[min(94vw,44rem)] overflow-hidden border border-line bg-card p-0 text-card-foreground max-w-2xl"></dialog><dialog aria-labelledby="_R_iki_" aria-describedby="_R_ikiH1_" class="technical-dialog m-auto max-h-[calc(100dvh-2rem)] w-[min(94vw,44rem)] overflow-hidden border border-line bg-card p-0 text-card-foreground max-w-xl"></dialog>
80<script type="module" src="/_next/static/chunks/index-D6PhHmbP.js" id="_R_" async=""></script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("0:{\"page:/\":\"$L1\",\"layout:/\":\"$L2\",\"route:/\":\"$L3\",\"__route\":\"route:/\",\"__interceptionContext\":null,\"__layoutIds\":[\"layout:/\"],\"__rootLayout\":\"/\",\"__bfcacheSegmentIdentities\":{\"layout:/\":\"[\\\"layout\\\",\\\"layout:/\\\",\\\"root-boundary:/\\\",\\\"\\\"]\",\"page:/\":\"[\\\"page\\\",\\\"page:/\\\",\\\"root-boundary:/\\\",\\\"\\\"]\"},\"__srcPage\":[\"page\"],\"__layoutFlags\":{\"layout:/\":\"s\"},\"__artifactCompatibility\":{\"schemaVersion\":1,\"graphVersion\":\"app-route-graph:1177fd80f83fa7b0\",\"deploymentVersion\":\"6c7c307a-9071-40a5-aedb-b714e54fb034\",\"appElementsSchemaVersion\":1,\"rscPayloadSchemaVersion\":1,\"rootBoundaryId\":\"/\",\"renderEpoch\":null},\"__dynamicStaleTime\":0}\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("8:\"GlobalErrorBoundary\"\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("9:I[\"593f344dc510\",[],\"$8\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("a:I[\"0b874ad30386\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("b:I[\"593f344dc510\",[],\"ErrorBoundary\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("c:\"LayoutSegmentProvider\"\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("d:I[\"15c18cfaeeff\",[],\"$c\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push(":HL[\"/_next/static/css/vinext-stage-runtime~0virtual_vinext-response-stage.-3BATVr8.css\",\"style\"]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("4:T18ea,")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("(function(){try{var a=\"mudasirweb-accent\";var m=\"mudasirweb-mode\";var t=[{\"id\":\"orange-burst\",\"c\":[\"#FF6A00\",\"#FF8E53\",\"#FFB347\",\"#FFF4EC\"],\"g\":\"linear-gradient(135deg, #FF6A00, #FF8E53)\",\"b\":\"#FFF4EC\",\"f\":\"#FFFFFF\",\"ab\":\"#ba4d00\"},{\"id\":\"mango-splash\",\"c\":[\"#FFB703\",\"#FFC837\",\"#FFD98A\",\"#FFF8E1\"],\"g\":\"linear-gradient(135deg, #FFB703, #FFC837)\",\"b\":\"#FFF8E1\",\"f\":\"#FFFFFF\",\"ab\":\"#976c02\"},{\"id\":\"grape-royale\",\"c\":[\"#5F0A87\",\"#9D4EDD\",\"#C77DFF\",\"#F5EEFA\"],\"g\":\"linear-gradient(135deg, #5F0A87, #9D4EDD)\",\"b\":\"#F5EEFA\",\"f\":\"#FFFFFF\",\"ab\":\"#5f0a87\"},{\"id\":\"berry-crush\",\"c\":[\"#D4145A\",\"#F857A6\",\"#FF7EB3\",\"#FDEAF1\"],\"g\":\"linear-gradient(135deg, #D4145A, #F857A6)\",\"b\":\"#FDEAF1\",\"f\":\"#FFFFFF\",\"ab\":\"#d4145a\"},{\"id\":\"apple-mint\",\"c\":[\"#00A878\",\"#2AF598\",\"#7DEFC4\",\"#E9FBF4\"],\"g\":\"linear-gradient(135deg, #00A878, #2AF598)\",\"b\":\"#E9FBF4\",\"f\":\"#FFFFFF\",\"ab\":\"#007a57\"},{\"id\":\"blueberry-ice\",\"c\":[\"#2193B0\",\"#3A7BD5\",\"#6DD5FA\",\"#EAF6FA\"],\"g\":\"linear-gradient(135deg, #2193B0, #3A7BD5)\",\"b\":\"#EAF6FA\",\"f\":\"#FFFFFF\",\"ab\":\"#1b778f\"},{\"id\":\"cherry-neon\",\"c\":[\"#FF0844\",\"#FF416C\",\"#FF6A88\",\"#FFE9EE\"],\"g\":\"linear-gradient(135deg, #FF0844, #FF416C)\",\"b\":\"#FFE9EE\",\"f\":\"#FFFFFF\",\"ab\":\"#e6073d\"},{\"id\":\"coconut-cream\",\"c\":[\"#B08968\",\"#D6BFA9\",\"#E2D1C3\",\"#FAF7F2\"],\"g\":\"linear-gradient(135deg, #B08968, #D6BFA9)\",\"b\":\"#FAF7F2\",\"f\":\"#FFFFFF\",\"ab\":\"#8f6f54\"},{\"id\":\"midnight-ink\",\"c\":[\"#0F2027\",\"#203A43\",\"#2C5364\",\"#E6EEF2\"],\"g\":\"linear-gradient(135deg, #0F2027, #203A43)\",\"b\":\"#E6EEF2\",\"f\":\"#FFFFFF\",\"ab\":\"#0f2027\"},{\"id\":\"royal-slate\",\"c\":[\"#2D2F4A\",\"#4B4E6D\",\"#8A8DB0\",\"#ECECF2\"],\"g\":\"linear-gradient(135deg, #2D2F4A, #4B4E6D)\",\"b\":\"#ECECF2\",\"f\":\"#FFFFFF\",\"ab\":\"#2d2f4a\"},{\"id\":\"emerald-elegance\",\"c\":[\"#0F9B8E\",\"#1CB5A3\",\"#A8E6CF\",\"#EAF8F2\"],\"g\":\"linear-gradient(135deg, #0F9B8E, #1CB5A3)\",\"b\":\"#EAF8F2\",\"f\":\"#FFFFFF\",\"ab\":\"#0c7e73\"},{\"id\":\"charcoal-gold\",\"c\":[\"#232526\",\"#414345\",\"#C9A24D\",\"#F6F2E8\"],\"g\":\"linear-gradient(135deg, #232526, #414345)\",\"b\":\"#F6F2E8\",\"f\":\"#FFFFFF\",\"ab\":\"#232526\"},{\"id\":\"ivory-silk\",\"c\":[\"#B7A98F\",\"#D6CFC4\",\"#EDE6D8\",\"#F9F7F3\"],\"g\":\"linear-gradient(135deg, #B7A98F, #D6CFC4)\",\"b\":\"#F9F7F3\",\"f\":\"#FFFFFF\",\"ab\":\"#786f5e\"},{\"id\":\"plum-noir\",\"c\":[\"#4A2F6E\",\"#7B4AE2\",\"#A98BE8\",\"#F2ECFA\"],\"g\":\"linear-gradient(135deg, #4A2F6E, #7B4AE2)\",\"b\":\"#F2ECFA\",\"f\":\"#FFFFFF\",\"ab\":\"#4a2f6e\"},{\"id\":\"steel-blue\",\"c\":[\"#1F3C88\",\"#27496D\",\"#A3CEF1\",\"#EEF4FA\"],\"g\":\"linear-gradient(135deg, #1F3C88, #27496D)\",\"b\":\"#EEF4FA\",\"f\":\"#FFFFFF\",\"ab\":\"#1f3c88\"},{\"id\":\"mocha-luxe\",\"c\":[\"#3E2723\",\"#5D4037\",\"#D7CCC8\",\"#F4EFEC\"],\"g\":\"linear-gradient(135deg, #3E2723, #5D4037)\",\"b\":\"#F4EFEC\",\"f\":\"#FFFFFF\",\"ab\":\"#3e2723\"},{\"id\":\"obsidian-night\",\"c\":[\"#1C1F2A\",\"#3A3F5C\",\"#6C7293\",\"#E8EAF0\"],\"g\":\"linear-gradient(135deg, #1C1F2A, #3A3F5C)\",\"b\":\"#E8EAF0\",\"f\":\"#FFFFFF\",\"ab\":\"#1c1f2a\"},{\"id\":\"nordic-frost\",\"c\":[\"#9FB3C8\",\"#C9D6E3\",\"#EAF0F6\",\"#F4F7FB\"],\"g\":\"linear-gradient(135deg, #9FB3C8, #C9D6E3)\",\"b\":\"#F4F7FB\",\"f\":\"#FFFFFF\",\"ab\":\"#687583\"},{\"id\":\"aurora-teal\",\"c\":[\"#0F766E\",\"#14B8A6\",\"#5EEAD4\",\"#E6FAF7\"],\"g\":\"linear-gradient(135deg, #0F766E, #14B8A6)\",\"b\":\"#E6FAF7\",\"f\":\"#FFFFFF\",\"ab\":\"#0f766e\"},{\"id\":\"graphite-amber\",\"c\":[\"#2A2A2A\",\"#3F3F3F\",\"#F4A261\",\"#FAF4EC\"],\"g\":\"linear-gradient(135deg, #2A2A2A, #3F3F3F)\",\"b\":\"#FAF4EC\",\"f\":\"#FFFFFF\",\"ab\":\"#2a2a2a\"},{\"id\":\"sage-stone\",\"c\":[\"#4F6F6F\",\"#6E8F8F\",\"#CAD2C5\",\"#F1F5F2\"],\"g\":\"linear-gradient(135deg, #4F6F6F, #6E8F8F)\",\"b\":\"#F1F5F2\",\"f\":\"#FFFFFF\",\"ab\":\"#4f6f6f\"},{\"id\":\"deep-ocean\",\"c\":[\"#003566\",\"#0077B6\",\"#4CC9F0\",\"#EAF4FB\"],\"g\":\"linear-gradient(135deg, #003566, #0077B6)\",\"b\":\"#EAF4FB\",\"f\":\"#FFFFFF\",\"ab\":\"#003566\"},{\"id\":\"carbon-violet\",\"c\":[\"#3A0CA3\",\"#7209B7\",\"#9D4EDD\",\"#F0ECFA\"],\"g\":\"linear-gradient(135deg, #3A0CA3, #7209B7)\",\"b\":\"#F0ECFA\",\"f\":\"#FFFFFF\",\"ab\":\"#3a0ca3\"},{\"id\":\"linen-pearl\",\"c\":[\"#B3A99A\",\"#DAD7CD\",\"#EDEAE6\",\"#F9F7F5\"],\"g\":\"linear-gra")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("dient(135deg, #B3A99A, #DAD7CD)\",\"b\":\"#F9F7F5\",\"f\":\"#FFFFFF\",\"ab\":\"#756f65\"},{\"id\":\"forest-ink\",\"c\":[\"#0B3D2E\",\"#1B5E4B\",\"#A7C7B7\",\"#EAF4EF\"],\"g\":\"linear-gradient(135deg, #0B3D2E, #1B5E4B)\",\"b\":\"#EAF4EF\",\"f\":\"#FFFFFF\",\"ab\":\"#0b3d2e\"},{\"id\":\"bronze-shadow\",\"c\":[\"#5A3E36\",\"#8A6A5B\",\"#B08968\",\"#F4EEE9\"],\"g\":\"linear-gradient(135deg, #5A3E36, #8A6A5B)\",\"b\":\"#F4EEE9\",\"f\":\"#FFFFFF\",\"ab\":\"#5a3e36\"},{\"id\":\"cloud-silver\",\"c\":[\"#64748B\",\"#94A3B8\",\"#CBD5E1\",\"#F6F8FB\"],\"g\":\"linear-gradient(135deg, #64748B, #94A3B8)\",\"b\":\"#F6F8FB\",\"f\":\"#FFFFFF\",\"ab\":\"#64748b\"},{\"id\":\"royal-indigo\",\"c\":[\"#312E81\",\"#4F46E5\",\"#A5B4FC\",\"#EEF0FF\"],\"g\":\"linear-gradient(135deg, #312E81, #4F46E5)\",\"b\":\"#EEF0FF\",\"f\":\"#FFFFFF\",\"ab\":\"#312e81\"},{\"id\":\"sunset-coral\",\"c\":[\"#E4572E\",\"#F2762E\",\"#F9A870\",\"#FFF3EC\"],\"g\":\"linear-gradient(135deg, #E4572E, #F2762E)\",\"b\":\"#FFF3EC\",\"f\":\"#FFFFFF\",\"ab\":\"#b94625\"},{\"id\":\"lime-zest\",\"c\":[\"#5C8A00\",\"#8BC34A\",\"#CDE89A\",\"#F5FAEA\"],\"g\":\"linear-gradient(135deg, #5C8A00, #8BC34A)\",\"b\":\"#F5FAEA\",\"f\":\"#FFFFFF\",\"ab\":\"#537c00\"}];var s=document.documentElement.style;var id=localStorage.getItem(a);if(id){for(var i=0;i!==t.length;i++){if(t[i].id===id){s.setProperty(\"--theme-color-1\",t[i].c[0]);s.setProperty(\"--theme-color-2\",t[i].c[1]);s.setProperty(\"--theme-color-3\",t[i].c[2]);s.setProperty(\"--theme-color-bg\",t[i].b);s.setProperty(\"--theme-gradient\",t[i].g);s.setProperty(\"--theme-action-fg\",t[i].f);s.setProperty(\"--theme-action-bg\",t[i].ab);break;}}}var mode=localStorage.getItem(m)||\"system\";var dark=mode===\"dark\"||(mode===\"system\"\u0026\u0026window.matchMedia(\"(prefers-color-scheme: dark)\").matches);document.documentElement.classList.toggle(\"dark\",dark);document.documentElement.style.colorScheme=dark?\"dark\":\"light\";var tile=dark?\"#0b0b0f\":(s.getPropertyValue(\"--theme-action-bg\").trim()||\"#5f0a87\");var glyph=dark?(s.getPropertyValue(\"--theme-color-3\").trim()||\"#c77dff\"):(s.getPropertyValue(\"--theme-action-fg\").trim()||\"#ffffff\");var ring=dark?'\\u003crect x=\"2\" y=\"2\" width=\"68\" height=\"68\" rx=\"12\" fill=\"none\" stroke=\"'+glyph+'\" stroke-width=\"3\"/\u003e':\"\";var svg='\\u003csvg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 72 72\" width=\"72\" height=\"72\"\u003e\\u003crect width=\"72\" height=\"72\" rx=\"14\" fill=\"'+tile+'\"/\u003e'+ring+'\\u003cpath d=\"M13 48V23h6l7 10 7-10h6v25h-7V35l-6 9-6-9v13Z\" fill=\"'+glyph+'\"/\u003e\\u003cpath d=\"M43 48V23h17v6H50v4h9v6h-9v9Z\" fill=\"'+glyph+'\" opacity=\".72\"/\u003e\\u003c/svg\u003e';var lk=document.querySelector('link[rel=\"icon\"]');
80if(lk){lk.setAttribute(\"type\",\"image/svg+xml\");lk.setAttribute(\"href\",\"data:image/svg+xml,\"+encodeURIComponent(svg));}}catch(e){}})();")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("2:[[[\"$\",\"link\",\"css:/_next/static/css/vinext-stage-runtime~0virtual_vinext-response-stage.-3BATVr8.css\",{\"rel\":\"stylesheet\",\"precedence\":\"vite-rsc/importer-resources\",\"href\":\"/_next/static/css/vinext-stage-runtime~0virtual_vinext-response-stage.-3BATVr8.css\",\"data-rsc-css-href\":\"/_next/static/css/vinext-stage-runtime~0virtual_vinext-response-stage.-3BATVr8.css\"}],\"$undefined\"],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"__variable_inter_1nj207z\",\"suppressHydrationWarning\":true,\"children\":[\"$\",\"body\",null,{\"className\":\"min-h-svh bg-background antialiased\",\"children\":[[\"$\",\"script\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"$4\"}}],\"$L5\",\"$L6\",\"$L7\"]}]}]]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("3:[[[\"$\",\"meta\",null,{\"charSet\":\"utf-8\"}],[[\"$\",\"title\",\"0\",{\"children\":\"Mudasir Fayaz — Frontend Engineer | React \u0026 Next.js Developer\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Mudasir Fayaz is a Frontend Engineer from Kashmir specializing in React, Next.js, Tailwind CSS, and Motion. Building fast, interactive web apps.\"}],[\"$\",\"meta\",\"2\",{\"name\":\"application-name\",\"content\":\"Mudasir Fayaz\"}],[\"$\",\"meta\",\"3\",{\"name\":\"keywords\",\"content\":\"Mudasir Fayaz,Frontend Engineer,frontend engineer Kashmir,React developer India,Next.js freelancer,Tailwind CSS developer,react developer,next.js,tailwind css,ui developer,portfolio\"}],[\"$\",\"meta\",\"4\",{\"name\":\"author\",\"content\":\"Mudasir Fayaz\"}],[\"$\",\"link\",\"5\",{\"rel\":\"author\",\"href\":\"https://mudasir.in\"}],[\"$\",\"meta\",\"6\",{\"name\":\"creator\",\"content\":\"Mudasir Fayaz\"}],[\"$\",\"meta\",\"7\",{\"name\":\"publisher\",\"content\":\"Mudasir Fayaz\"}],[\"$\",\"meta\",\"8\",{\"name\":\"format-detection\",\"content\":\"telephone=no\"}],[\"$\",\"meta\",\"9\",{\"name\":\"category\",\"content\":\"technology\"}],[\"$\",\"meta\",\"10\",{\"name\":\"robots\",\"content\":\"index, follow\"}],[\"$\",\"meta\",\"11\",{\"name\":\"googlebot\",\"content\":\"index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1\"}],[\"$\",\"meta\",\"12\",{\"property\":\"og:title\",\"content\":\"Mudasir Fayaz — Frontend Engineer | React \u0026 Next.js Developer\"}],[\"$\",\"meta\",\"13\",{\"property\":\"og:description\",\"content\":\"Frontend Engineer from Kashmir building fast, interactive web apps with React, Next.js \u0026 Tailwind CSS.\"}],[\"$\",\"meta\",\"14\",{\"property\":\"og:url\",\"content\":\"https://mudasir.in\"}],[\"$\",\"meta\",\"15\",{\"property\":\"og:site_name\",\"content\":\"Mudasir Fayaz\"}],[\"$\",\"meta\",\"16\",{\"property\":\"og:type\",\"content\":\"website\"}],[\"$\",\"meta\",\"17\",{\"property\":\"og:locale\",\"content\":\"en_US\"}],[\"$\",\"meta\",\"18\",{\"property\":\"og:image\",\"content\":\"https://mudasir.in/meta-img.png\"}],[\"$\",\"meta\",\"19\",{\"property\":\"og:image:width\",\"content\":\"1200\"}],[\"$\",\"meta\",\"20\",{\"property\":\"og:image:height\",\"content\":\"630\"}],[\"$\",\"meta\",\"21\",{\"property\":\"og:image:alt\",\"content\":\"Mudasir Fayaz — Frontend Engineer\"}],[\"$\",\"meta\",\"22\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"23\",{\"name\":\"twitter:site\",\"content\":\"@mudasirbuilds\"}],[\"$\",\"meta\",\"24\",{\"name\":\"twitter:title\",\"content\":\"Mudasir Fayaz — Frontend Engineer | React \u0026 Next.js Developer\"}],[\"$\",\"meta\",\"25\",{\"name\":\"twitter:description\",\"content\":\"Frontend Engineer from Kashmir building fast, interactive web apps with React, Next.js \u0026 Tailwind CSS.\"}],[\"$\",\"meta\",\"26\",{\"name\":\"twitter:creator\",\"content\":\"@mudasirbuilds\"}],[\"$\",\"meta\",\"27\",{\"name\":\"twitter:image\",\"content\":\"https://mudasir.in/meta-img.png\"}],[\"$\",\"link\",\"28\",{\"data-vinext-streamed-icon\":\"$undefined\",\"rel\":\"icon\",\"href\":\"/favicon.ico?9ecfcc8f0ead0bf3\",\"type\":\"image/x-icon\",\"sizes\":\"256x256\",\"color\":\"$undefined\",\"media\":\"$undefined\",\"fetchPriority\":\"$undefined\"}],[\"$\",\"link\",\"29\",{\"data-vinext-streamed-icon\":\"$undefined\",\"rel\":\"icon\",\"href\":\"/icon.svg\",\"type\":\"image/svg+xml\",\"sizes\":\"$undefined\",\"color\":\"$undefined\",\"media\":\"$undefined\",\"fetchPriority\":\"$undefined\"}],[\"$\",\"link\",\"30\",{\"data-vinext-streamed-icon\":\"$undefined\",\"rel\":\"icon\",\"href\":\"/icons/icon-192.png\",\"type\":\"image/png\",\"sizes\":\"192x192\",\"color\":\"$undefined\",\"media\":\"$undefined\",\"fetchPriority\":\"$undefined\"}],[\"$\",\"link\",\"31\",{\"data-vinext-streamed-icon\":\"$undefined\",\"rel\":\"icon\",\"href\":\"/icons/icon-512.png\",\"type\":\"image/png\",\"sizes\":\"512x512\",\"color\":\"$undefined\",\"media\":\"$undefined\",\"fetchPriority\":\"$undefined\"}],[\"$\",\"link\",\"32\",{\"data-vinext-streamed-icon\":\"$undefined\",\"rel\":\"apple-touch-icon\",\"href\":\"/icons/apple-touch-icon.png\",\"type\":\"$undefined\",\"sizes\":\"$undefined\",\"color\":\"$undefined\",\"media\":\"$undefined\",\"fetchPriority\":\"$undefined\"}],[\"$\",\"link\",\"33\",{\"rel\":\"manifest\",\"href\":\"/manifest.webmanifest\"}],[\"$\",\"link\",\"34\",{\"rel\":\"canonical\",\"href\":\"https://mudasir.in\"}],[\"$\",\"meta\",\"35\",{\"name\":\"mobile-web-app-capable\",\"content\":\"yes\"}],[\"$\",\"meta\",\"36\",{\"name\":\"apple-mobile-web-app-title\",\"content\":\"Mudasir Fayaz\"}],[\"$\",\"meta\",\"37\",{\"name\":\"apple-mobile-web-app-status-bar-style\",\"content\":\"default\"}]],[[\"$\",\"meta\",\"0\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1, maximum-scale=5, viewport-fit=cover\"}],[\"$\",\"meta\",\"1\",{\"name\":\"theme-color\",\"content\":\"#ffffff\",\"media\":\"(prefers-color-scheme: light)\"}],[\"$\",\"meta\",\"2\",{\"name\":\"theme-color\",\"content\":\"#0b0b0f\",\"media\":\"(prefers-color-scheme: dark)\"}]]],[\"$\",\"$L9\",null,{\"fallback\":\"$a\",\"children\":[\"$\",\"$Lb\",null,{\"fallback\":\"$a\",\"children\":[\"$\",\"$Ld\",null,{\"providerId\":\"layout:/\",\"segmentMap\":{\"children\":[]},\"children\":\"$Le\"}]}]}],null,null]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("f:I[\"2b04cc7da83a\",[],\"ThemeProvider\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("10:I[\"b2c6f947f55c\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("11:I[\"590405463cf5\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("12:I[\"83cf574bf4bc\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("18:I[\"8c0f216c4604\",[],\"Slot\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("19:\"NotFoundBoundary\"\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("1a:I[\"593f344dc510\",[],\"$19\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("1b:I[\"c2747888630f\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("1c:\"AppRouterScrollTarget\"\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("1d:I[\"9276801271d6\",[],\"$1c\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("1e:\"RedirectBoundary\"\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("1f:I[\"593f344dc510\",[],\"$1e\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("5:[\"$\",\"a\",null,{\"href\":\"#main-content\",\"className\":\"skip-link\",\"children\":\"Skip to content\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("6:[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@graph\\\":[{\\\"@type\\\":\\\"Person\\\",\\\"@id\\\":\\\"https://mudasir.in/#person\\\",\\\"name\\\":\\\"Mudasir Fayaz\\\",\\\"url\\\":\\\"https://mudasir.in\\\",\\\"image\\\":\\\"https://mudasir.in/profile_pic.webp\\\",\\\"jobTitle\\\":\\\"Frontend Engineer\\\",\\\"description\\\":\\\"Mudasir Fayaz is a Frontend Engineer from Kashmir specializing in React, Next.js, Tailwind CSS, and Motion. Building fast, interactive web apps.\\\",\\\"sameAs\\\":[\\\"https://github.com/Mudasir-Fayaz\\\",\\\"https://x.com/mudasirbuilds\\\",\\\"https://linkedin.com/in/Mudasir-Fayaz\\\"],\\\"knowsAbout\\\":[\\\"React\\\",\\\"Next.js\\\",\\\"Tailwind CSS\\\",\\\"Motion\\\",\\\"Supabase\\\",\\\"MongoDB\\\"],\\\"address\\\":{\\\"@type\\\":\\\"PostalAddress\\\",\\\"addressRegion\\\":\\\"Kashmir\\\",\\\"addressCountry\\\":\\\"IN\\\"},\\\"makesOffer\\\":{\\\"@type\\\":\\\"Offer\\\",\\\"name\\\":\\\"Freelance Frontend Development\\\",\\\"availability\\\":\\\"https://schema.org/InStock\\\"}},{\\\"@type\\\":\\\"WebSite\\\",\\\"@id\\\":\\\"https://mudasir.in/#website\\\",\\\"url\\\":\\\"https://mudasir.in\\\",\\\"name\\\":\\\"Mudasir Fayaz — Frontend Engineer\\\",\\\"publisher\\\":{\\\"@id\\\":\\\"https://mudasir.in/#person\\\"}}]}\"}}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("7:[\"$\",\"$Lf\",null,{\"children\":[[\"$\",\"$L10\",null,{}],[\"$\",\"$L11\",null,{\"children\":[[\"$\",\"div\",null,{\"className\":\"relative min-h-svh py-0 sm:py-5\",\"children\":[[\"$\",\"div\",null,{\"aria-hidden\":true,\"className\":\"dots pointer-events-none fixed inset-0 opacity-50\"}],[\"$\",\"div\",null,{\"className\":\"site-shell relative mx-auto flex min-h-svh flex-col bg-page\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-1\",\"children\":[[\"$\",\"div\",null,{\"aria-hidden\":true,\"className\":\"rail w-2 shrink-0 border-x border-line sm:w-3.5 lg:w-5\"}],[\"$\",\"div\",null,{\"className\":\"flex min-w-0 flex-1 flex-col\",\"children\":[[\"$\",\"$L12\",null,{\"searchItems\":[{\"title\":\"Home\",\"description\":\"I build clear, fast interfaces for products that need thoughtful interaction design and production-ready frontend engineering.\",\"href\":\"/\",\"group\":\"Page\"},{\"title\":\"Projects\",\"description\":\"Browse projects by Mudasir Fayaz.\",\"href\":\"/projects\",\"group\":\"Page\"},{\"title\":\"Components\",\"description\":\"Browse components by Mudasir Fayaz.\",\"href\":\"/components\",\"group\":\"Page\"},{\"title\":\"Tools\",\"description\":\"Browse tools by Mudasir Fayaz.\",\"href\":\"/tools\",\"group\":\"Page\"},{\"title\":\"Blog\",\"description\":\"Browse blog by Mudasir Fayaz.\",\"href\":\"/blog\",\"group\":\"Page\"},{\"title\":\"Experience\",\"description\":\"Open the experience page.\",\"href\":\"/experience\",\"group\":\"Page\"},{\"title\":\"Resources\",\"description\":\"Open the resources page.\",\"href\":\"/resources\",\"group\":\"Page\"},{\"title\":\"Inspirations\",\"description\":\"Open the inspirations page.\",\"href\":\"/inspirations\",\"group\":\"Page\"},{\"title\":\"Contact\",\"description\":\"Open the contact page.\",\"href\":\"/contact\",\"group\":\"Page\"},{\"title\":\"SJ Polyclinics\",\"description\":\"Polyclinic website with online appointment booking \u0026 management features.\",\"href\":\"https://sjpolyclinics.com\",\"group\":\"Project\",\"keywords\":[\"Healthcare\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\",\"Supabase\"],\"external\":true},{\"title\":\"MedScan Ultrasounds\",\"description\":\"Landing page of MedScan Ultrasounds — No. 1 Ultrasound Centre in Baramulla.\",\"href\":\"https://medscanbla.com\",\"group\":\"Project\",\"keywords\":[\"Healthcare\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\",\"Supabase\"],\"external\":true},{\"title\":\"ACIT\",\"description\":\"Landing page of ACIT — Kashmir's No. 1 commerce institute with 20 years of experience.\",\"href\":\"https://myacit.in\",\"group\":\"Project\",\"keywords\":[\"Education\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"Medvue Healthlabs\",\"description\":\"Landing page website of Medvue Healthlabs providing online lab test booking services.\",\"href\":\"https://medvuelabs.pages.dev\",\"group\":\"Project\",\"keywords\":[\"Healthcare\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"Computer Institute\",\"description\":\"Landing page website of a computer institute offering various computer courses.\",\"href\":\"https://computer-institute.pages.dev\",\"group\":\"Project\",\"keywords\":[\"Education\",\"HTML\",\"CSS\",\"Tailwind\",\"AOS\"],\"external\":true},{\"title\":\"GymClub Website\",\"description\":\"Landing page website of GymClub offering various fitness training memberships.\",\"href\":\"https://gym-club.pages.dev\",\"group\":\"Project\",\"keywords\":[\"Landing Page\",\"HTML\",\"CSS\",\"Tailwind\",\"AOS\"],\"external\":true},{\"title\":\"Web SuperKit\",\"description\":\"Web SuperKit — 100+ developer tools in one Chrome extension. All your developer tools in one place.\",\"href\":\"https://websuperkit.in\",\"group\":\"Project\",\"keywords\":[\"Developer Tool\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\",\"Chrome API\"],\"external\":true},{\"title\":\"Vehicle Showroom Page\",\"description\":\"Modern vehicle showroom landing page with advanced animations and a user friendly interface.\",\"href\":\"https://vehicleshowroomkmr.vercel.app\",\"group\":\"Project\",\"keywords\":[\"Landing Page\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"EduVista Landing Page\",\"description\":\"Modern school landing page with advanced animations and a user-friendly interface.\",\"href\":\"https://eduvista100.vercel.app\",\"group\":\"Project\",\"keywords\":[\"Education\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"School Management\",\"description\":\"School Management System — Student, Parent \u0026 Admin login.\",\"href\":\"https://schoolpanel100.vercel.app\",\"group\":\"Project\",\"keywords\":[\"Education\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"School Panel with Payments\",\"description\":\"School Management System with demo payments integration.\",\"href\":\"https://schoolpanelpay.vercel.app\",\"group\":\"Project\",\"keywords\":[\"Education\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"WikiTok\",\"description\":\"TikTok for Wikipedia pages — bookmark, listen and download slides.\",\"href\":\"https://wikitok.mudasir.in\",\"group\":\"Project\",\"keywords\":[\"Web App\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"GPT SmartKit\",\"description\":\"ChatGPT Chrome extension for themes, auto prompting, prompt library and many more features.\",\"href\":\"https://gptsmartkit.in\",\"group\":\"Project\",\"keywords\":[\"Developer Tool\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"Achievr\",\"description\":\"Track habits, manage to-dos, and jot down notes effortlessly, with seamless sync across devices.\",\"href\":\"https://achievr.mudasir.in\",\"group\":\"Project\",\"keywords\":[\"Web App\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"Markdown Machine\",\"description\":\"Convert multiple webpage URLs into markdown format with a single click.\",\"href\":\"https://markdownmachine.mudasir.in\",\"group\":\"Project\",\"keywords\":[\"Developer Tool\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"Bio Generator\",\"description\":\"Generate engaging and personalized social media bios effortlessly with AI-powered creativity.\",\"href\":\"https://socialbioai.vercel.app\",\"group\":\"Project\",\"keywords\":[\"Web App\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"Quick DevUtils\",\"description\":\"Access 100+ mini apps and tools designed to simplify and accelerate development tasks.\",\"href\":\"https://devutils.mudasir.in\",\"group\":\"Project\",\"keywords\":[\"Developer Tool\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"TBI Plus\",\"description\":\"Design stunning depth effects by layering text and images with ease.\",\"href\":\"https://tbi.mudasir.in\",\"group\":\"Project\",\"keywords\":[\"Design Tool\",\"ReactJS\",\"NextJS\",\"Tailwind\",\"Motion\"],\"external\":true},{\"title\":\"Animated Button\",\"description\":\"A call-to-action button with hover effects and an animated arrow. Perfect for hero sections and primary actions.\",\"href\":\"/components/
80animated-button\",\"group\":\"Component\",\"keywords\":[\"button\"]},{\"title\":\"Feature Card\",\"description\":\"Modern feature card with icon, title, and description. Perfect for showcasing product features and benefits.\",\"href\":\"/components/feature-card\",\"group\":\"Component\",\"keywords\":[\"card\"]},{\"title\":\"Testimonial Card\",\"description\":\"Elegant testimonial card with a gradient background and avatar. Perfect for displaying customer reviews.\",\"href\":\"/components/testimonial-card\",\"group\":\"Component\",\"keywords\":[\"card\"]},{\"title\":\"Pricing Card\",\"description\":\"Professional pricing card with a features list and CTA button. Great for pricing pages and subscriptions.\",\"href\":\"/components/pricing-card\",\"group\":\"Component\",\"keywords\":[\"card\"]},{\"title\":\"Progress Bar\",\"description\":\"Animated progress indicator with smooth transitions. Ideal for loading states and completion percentages.\",\"href\":\"/components/progress-bar\",\"group\":\"Component\",\"keywords\":[\"progress\"]},{\"title\":\"Notification Toast\",\"description\":\"Clean toast notification with smooth animations. Great for success messages and user feedback.\",\"href\":\"/components/notification-toast\",\"group\":\"Component\",\"keywords\":[\"notification\"]},{\"title\":\"Rating Stars\",\"description\":\"Interactive star rating component with hover effects. Ideal for reviews and product ratings.\",\"href\":\"/components/rating-stars\",\"group\":\"Component\",\"keywords\":[\"interactive\"]},{\"title\":\"Toggle Switch\",\"description\":\"Smooth toggle switch with spring animation. Perfect for settings, preferences, and boolean options.\",\"href\":\"/components/toggle-switch\",\"group\":\"Component\",\"keywords\":[\"interactive\"]},{\"title\":\"Stats Counter\",\"description\":\"Animated statistics counter with gradient background. Excellent for showcasing impressive numbers.\",\"href\":\"/components/stats-counter\",\"group\":\"Component\",\"keywords\":[\"stats\"]},{\"title\":\"Badge\",\"description\":\"Colorful status badges with hover animations. Great for labels, tags, and status indicators.\",\"href\":\"/components/badge\",\"group\":\"Component\",\"keywords\":[\"label\"]},{\"title\":\"Color Picker\",\"description\":\"Pick colors, generate tints \u0026 shades, and copy HEX, RGB, or HSL values instantly.\",\"href\":\"/tools/color-picker\",\"group\":\"Tool\",\"keywords\":[\"Design\"]},{\"title\":\"Contrast Checker\",\"description\":\"Check color contrast ratios and WCAG accessibility compliance in real time.\",\"href\":\"/tools/contrast-checker\",\"group\":\"Tool\",\"keywords\":[\"Design\"]},{\"title\":\"Gradient Generator\",\"description\":\"Create linear and radial CSS gradients with multiple color stops and presets.\",\"href\":\"/tools/gradient-generator\",\"group\":\"Tool\",\"keywords\":[\"Design\"]},{\"title\":\"Shadow Generator\",\"description\":\"Design modern CSS box-shadows with live preview, presets, and multiple layers.\",\"href\":\"/tools/shadow-generator\",\"group\":\"Tool\",\"keywords\":[\"Design\"]},{\"title\":\"Unit Converter\",\"description\":\"Convert length, weight, area, speed, and temperature units instantly.\",\"href\":\"/tools/unit-converter\",\"group\":\"Tool\",\"keywords\":[\"Utilities\"]},{\"title\":\"Word Counter\",\"description\":\"Analyze text with word count, reading time, keyword density, and insights.\",\"href\":\"/tools/word-counter\",\"group\":\"Tool\",\"keywords\":[\"Utilities\"]},{\"title\":\"Code Formatter\",\"description\":\"Format JavaScript, JSON, HTML, and CSS code with clean indentation.\",\"href\":\"/tools/code-formatter\",\"group\":\"Tool\",\"keywords\":[\"Development\"]}
80,{\"title\":\"API Tester\",\"description\":\"Send GET, POST, PUT, PATCH, and DELETE requests and inspect responses.\",\"href\":\"/tools/api-tester\",\"group\":\"Tool\",\"keywords\":[\"Development\"]},{\"title\":\"Markdown Editor\",\"description\":\"Write markdown with a formatting toolbar and live HTML preview.\",\"href\":\"/tools/markdown-editor\",\"group\":\"Tool\",\"keywords\":[\"Productivity\"]},{\"title\":\"Image Optimizer\",\"description\":\"Convert JPG, PNG, and AVIF images to lightweight WebP right in your browser.\",\"href\":\"/tools/image-optimizer\",\"group\":\"Tool\",\"keywords\":[\"Media\"]},{\"title\":\"Serverless file uploads with Supabase Storage and Next.js API routes\",\"description\":\"Secure, serverless file uploads in Next.js using Supabase Storage, with validation, size limits, and public access handling.\",\"href\":\"/blog/serverless-file-uploads-with-supabase-storage-and-nextjs-api-routes\",\"group\":\"Writing\",\"keywords\":[\"next.js\",\"supabase\",\"storage\",\"uploads\"]},{\"title\":\"Building a modern todo app with Zustand, Firebase, and Next.js\",\"description\":\"A real-time todo app with authentication, CRUD operations, and predictable global state, built with Next.js, Firebase, and Zustand.\",\"href\":\"/blog/building-modern-todo-app-with-zustand-firebase-and-nextjs\",\"group\":\"Writing\",\"keywords\":[\"next.js\",\"firebase\",\"zustand\",\"fullstack\"]},{\"title\":\"Integrating Razorpay payments in Next.js: a step-by-step guide\",\"description\":\"Set up checkout, verify signatures on the server, and handle webhooks safely when integrating Razorpay with Next.js.\",\"href\":\"/blog/integrating-razorpay-payments-in-nextjs-step-by-step-guide-for-developers\",\"group\":\"Writing\",\"keywords\":[\"next.js\",\"payments\",\"razorpay\",\"server\"]},{\"title\":\"How I built a fullstack authentication system with Next.js, Supabase, and Tailwind\",\"description\":\"Email sign-in, session handling, and protected routes in a Next.js App Router app, built on Supabase auth with a clean Tailwind interface.\",\"href\":\"/blog/how-i-built-fullstack-authentication-system-with-nextjs-supabase-and-tailwind\",\"group\":\"Writing\",\"keywords\":[\"next.js\",\"supabase\",\"auth\",\"fullstack\"]},{\"title\":\"Optimizing Next.js app performance with Cloudflare CDN and edge functions\",\"description\":\"A practical checklist for cutting latency on a Next.js deployment with a CDN in front and edge logic close to the user.\",\"href\":\"/blog/optimizing-nextjs-app-performance-with-cloudflare-cdn-and-vercel-edge-functions\",\"group\":\"Writing\",\"keywords\":[\"next.js\",\"performance\",\"cloudflare\",\"edge\"]},{\"title\":\"From static to dynamic: using TanStack Query for real-time data in Next.js\",\"description\":\"How to layer client-side caching and background refresh on top of a static Next.js page with TanStack Query.\",\"href\":\"/blog/from-static-to-dynamic-using-tanstack-query-for-real-time-data-in-nextjs\",\"group\":\"Writing\",\"keywords\":[\"next.js\",\"tanstack-query\",\"data\",\"caching\"]},{\"title\":\"How to create a responsive navbar in Next.js with TypeScript and Zustand\",\"description\":\"Build an accessible, responsive navigation bar in the Next.js App Router using TypeScript and Zustand for predictable global state.\",\"href\":\"/blog/responsive-navbar-nextjs-typescript-zustand\",\"group\":\"Writing\",\"keywords\":[\"next.js\",\"typescript\",\"zustand\",\"ui\"]},{\"title\":\"Building stunning animated UI with Motion and Tailwind CSS in Next.js\",\"description\":\"A practical guide to building fluid, interactive interfaces with Motion and Tailwind CSS in a Next.js App Router project, without hurting performance.\",\"href\":\"/blog/building-stunning-animated-ui-with-motion-react-and-tailwind-css-in-nextjs\",\"group\":\"Writing\",\"keywords\":[\"next.js\",\"motion\",\"tailwind\",\"animation\"]},{\"title\":\"Colors and Fonts\",\"description\":\"Great fonts and color palettes\",\"href\":\"https://www.colorsandfonts.com/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"CSS Checkboxes\",\"description\":\"Copy checkbox styles\",\"href\":\"https://getcssscan.com/css-checkboxes-examples\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"CSS Buttons\",\"description\":\"Copy button styles\",\"href\":\"https://getcssscan.com/css-buttons-examples\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"React Icons\",\"description\":\"Icon packs from many libraries\",\"href\":\"https://react-icons.github.io/react-icons/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Lookup.design\",\"description\":\"Website component inspirations\",\"href\":\"https://lookup.design/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Microcopy\",\"description\":\"Website copy instead of lorem ipsum\",\"href\":\"https://www.microcopy.me/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Supercreative\",\"description\":\"1000+ modern website inspirations\",\"href\":\"https://supercreative.design/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Shots.so\",\"description\":\"Beautiful web \u0026 mobile mockups\",\"href\":\"https://shots.so/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Maizzle\",\"description\":\"Email templates with Tailwind\",\"href\":\"https://maizzle.com/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Alexandru.so\",\"description\":\"Tailwind snippets\",\"href\":\"https://alexandru.so/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Mantine\",\"description\":\"Component library with hooks\",\"href\":\"https://mantine.dev/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Tailwind Box Shadows\",\"description\":\"Shadow presets\",\"href\":\"https://manuarora.in/boxshadows\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Get Avataaars\",\"description\":\"Free avatar generator\",\"href\":\"https://getavataaars.com/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Experte\",\"description\":\"Remove backgrounds in HD\",\"href\":\"https://www.experte.com/background-remover\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Hypercolor\",\"description\":\"Tailwind gradients\",\"href\":\"https://hypercolor.dev/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Undesign\",\"description\":\"Free icons \u0026 illustrations\",\"href\":\"https://undesign.learn.uno/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Haikei\",\"description\":\"SVG blobs \u0026 waves generator\",\"href\":\"https://haikei.app/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Ray.so\",\"description\":\"Code to image converter\",\"href\":\"https://ray.so/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Neumorphism.io\",\"description\":\"Neumorphic UI generator\",\"href\":\"https://neumorphism.io/\",\"group\":\"Resource\",\"keywords\":[\"Utilities\"],\"external\":true},{\"title\":\"Storyset\",\"description\":\"Illustrations \u0026 icons\",\"href\":\"https://storyset.com/\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"Tailwind UI Kit\",\"description\":\"Free Tailwind components\",\"href\":\"https://www.tailwind-kit.com/\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"UI Gradients\",\"description\":\"Gradient collections\",\"href\":\"https://uigradients.c
80om/\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"Heroicons\",\"description\":\"Minimal icon pack\",\"href\":\"https://heroicons.com/\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"Get Waves\",\"description\":\"SVG waves generator\",\"href\":\"https://getwaves.io/\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"Happy Hues\",\"description\":\"Color schemes\",\"href\":\"https://www.happyhues.co/\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"Lukasz Adam\",\"description\":\"Free illustrations\",\"href\":\"https://lukaszadam.com/illustrations\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"Iconscout\",\"description\":\"Paper illustrations\",\"href\":\"https://iconscout.com/paper-illustrations\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"BGJar\",\"description\":\"Background generator\",\"href\":\"https://bgjar.com/\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"Limitless Designs\",\"description\":\"Avatar library\",\"href\":\"https://limitlessdesigns.io/\",\"group\":\"Resource\",\"keywords\":[\"User Interface\"],\"external\":true},{\"title\":\"CSS.gg\",\"description\":\"700+ free icons\",\"href\":\"https://css.gg/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Loripsum\",\"description\":\"Advanced lorem ipsum\",\"href\":\"https://loripsum.net/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Browser Lite\",\"description\":\"Browser inside VS Code\",\"href\":\"https://marketplace.visualstudio.com/items?itemName=antfu.browse-lite\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Site Inspector\",\"description\":\"Website inspection\",\"href\":\"https://www.getsiteinspector.com/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Public APIs\",\"description\":\"API collections\",\"href\":\"https://publicapis.io/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"EasyDB\",\"description\":\"One-click DB deploy\",\"href\":\"https://easydb.io/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Remove.bg\",\"description\":\"Background remover\",\"href\":\"https://www.remove.bg/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"MetaTags\",\"description\":\"Meta tag generator\",\"href\":\"https://metatags.io/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Picsum\",\"description\":\"Random placeholder images\",\"href\":\"https://picsum.photos/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Codeimg\",\"description\":\"Code to image\",\"href\":\"https://codeimg.io/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Responsively\",\"description\":\"Responsive testing\",\"href\":\"https://responsively.app/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Dev Fonts\",\"description\":\"Developer fonts\",\"href\":\"https://devfonts.gafi.dev/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Peek.link\",\"description\":\"Social thumbnails\",\"href\":\"https://peek.link/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"100 Daily UI\",\"description\":\"Figma mockups\",\"href\":\"https://www.dailyui.co/\",\"group\":\"Resource\",\"keywords\":[\"Everyday Use\"],\"external\":true},{\"title\":\"Themesberg\",\"description\":\"Free Bootstrap themes\",\"href\":\"https://themesberg.com/\",\"group\":\"Resource\",\"keywords\":[\"Free Themes\"],\"external\":true},{\"title\":\"Mashup Template\",\"description\":\"HTML templates\",\"href\":\"https://www.mashup-template.com/\",\"group\":\"Resource\",\"keywords\":[\"Free Themes\"],\"external\":true},{\"title\":\"Landing Stock\",\"description\":\"Landing page designs\",\"href\":\"https://landingstock.com/\",\"group\":\"Resource\",\"keywords\":[\"Free Themes\"],\"external\":true},{\"title\":\"Creative Tim\",\"description\":\"Free themes \u0026 UI kits\",\"href\":\"https://www.creative-tim.com/\",\"group\":\"Resource\",\"keywords\":[\"Free Themes\"],\"external\":true},{\"title\":\"ResumeWorded\",\"description\":\"LinkedIn profile analysis\",\"href\":\"https://resumeworded.com/linkedin-review/\",\"group\":\"Resource\",\"keywords\":[\"Productivity\"],\"external\":true},{\"title\":\"Dan Abramov\",\"description\":\"Co-author of Redux and Create React App. Works on the React team at Meta.\",\"href\":\"https://overreacted.io/\",\"group\":\"Resource\",\"keywords\":[\"Frontend Developer\",\"inspiration\"],\"external\":true},{\"title\":\"Kent C. Dodds\",\"description\":\"Making software development more accessible. Educator and open source contributor.\",\"href\":\"https://kentcdodds.com/\",\"group\":\"Resource\",\"keywords\":[\"Frontend Developer\",\"inspiration\"],\"external\":true},{\"title\":\"Theo Browne\",\"description\":\"CEO of Ping Labs. Creating educational content about modern web development.\",\"href\":\"https://t3.gg/\",\"group\":\"Resource\",\"keywords\":[\"Frontend Developer\",\"inspiration\"],\"external\":true},{\"title\":\"Lee Robinson\",\"description\":\"VP of Developer Experience at Vercel. Teaching Next.js and web development.\",\"href\":\"https://leerob.io/\",\"group\":\"Resource\",\"keywords\":[\"Frontend Developer\",\"inspiration\"],\"external\":true},{\"title\":\"Addy Osmani\",\"description\":\"Engineering Manager at Google Chrome. Web performance and tooling expert.\",\"href\":\"https://addyosmani.com/\",\"group\":\"Resource\",\"keywords\":[\"Frontend Developer\",\"inspiration\"],\"external\":true},{\"title\":\"Sarah Drasner\",\"description\":\"VP of Developer Experience at Netlify. Vue core team member and CSS animation expert.\",\"href\":\"https://sarah.dev/\",\"group\":\"Resource\",\"keywords\":[\"Designer\",\"inspiration\"],\"external\":true},{\"title\":\"Steve Schoger\",\"description\":\"Co-creator of Tailwind UI. Design tips and UI/UX excellence.\",\"href\":\"https://www.steveschoger.com/\",\"group\":\"Resource\",\"keywords\":[\"Designer\",\"inspiration\"],\"external\":true},{\"title\":\"Refactoring UI\",\"description\":\"Adam Wathan \u0026 Steve Schoger teaching interface design best practices.\",\"href\":\"https://www.refactoringui.com/\",\"group\":\"Resource\",\"keywords\":[\"Designer\",\"inspiration\"],\"external\":true},{\"title\":\"Guillermo Rauch\",\"description\":\"CEO of Vercel. Creator of Next.js and Socket.io.\",\"href\":\"https://rauchg.com/\",\"group\":\"Resource\",\"keywords\":[\"Founder\",\"inspiration\"],\"external\":true},{\"title\":\"Pieter Levels\",\"description\":\"Indie maker building Nomad List, RemoteOK, and PhotoAI. Digital nomad lifestyle.\",\"href\":\"https://levels.io/\",\"group\":\"Resource\",\"keywords\":[\"Founder\",\"inspiration\"],\"external\":true},{\"title\":\"Marc Lou\",\"description\":\"Building startups fast. Creator of the ShipFast boilerplate.\",\"href\":\"https://marclou.com/\",\"group\":\"Resource\",\"keywords\":[\"Founder\",\"inspiration\"],\"external\":true},{\"title\":\"Tony Dinh\",\"description\":\"Indie hacker building profitable SaaS products. Creator of DevUtils and Black Magic.\",\"href\":\"https://tonydinh.com/\",\"group\":\"Resource\",\"keywords\":[\"Founder\",\"inspiration\"],\"external\":true},{\"title\":\"The Primeagen\",\"description\":\"Software engineer and streaming creator. Developer productivity and tooling.\",\"href\":\"https://www.theprimeagen.tv/\",\"group\":\"Resource\",\"keywords\":[\"Backend Developer\",\"inspiration\"],\"external\":true}]}],\"$L13\"]}],\"$L14\"]}],\"$L15\"]}]]}],\"$L16\",\"$L17\"]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("e:[\"$\",\"$L18\",null,{\"id\":\"layout:/\",\"parallelSlots\":\"$undefined\",\"children\":[\"$\",\"$L1a\",null,{\"resetKey\":\"\",\"fallback\":[\"$\",\"section\",null,{\"className\":\"flex min-h-[60svh] flex-col items-center justify-center px-4 py-16 text-center\",\"children\":[[\"$\",\"p\",null,{\"className\":\"bg-gradient-theme bg-clip-text text-7xl font-black tracking-tight text-transparent sm:text-9xl\",\"children\":\"404\"}],[\"$\",\"h1\",null,{\"className\":\"mt-3 text-lg font-bold tracking-tight\",\"children\":\"This page went missing\"}],[\"$\",\"p\",null,{\"className\":\"mt-1 max-w-sm text-sm text-muted-foreground\",\"children\":\"The page you're looking for doesn't exist or has been moved.\"}],[\"$\",\"div\",null,{\"className\":\"mt-5 flex flex-wrap justify-center gap-2\",\"children\":[[\"$\",\"$L1b\",null,{\"href\":\"/\",\"className\":\"rounded-md bg-gradient-theme px-4 py-2 text-sm font-medium text-white\",\"children\":\"Back home\"}],[\"$\",\"$L1b\",null,{\"href\":\"/projects\",\"className\":\"rounded-md border border-line bg-card px-4 py-2 text-sm font-medium transition-colors hover:bg-muted\",\"children\":\"View projects\"}]]}]]}],\"children\":[\"$\",\"$L1a\",null,{\"resetKey\":\"\",\"fallback\":[\"$\",\"section\",null,{\"className\":\"flex min-h-[60svh] flex-col items-center justify-center px-4 py-16 text-center\",\"children\":[[\"$\",\"p\",null,{\"className\":\"bg-gradient-theme bg-clip-text text-7xl font-black tracking-tight text-transparent sm:text-9xl\",\"children\":\"404\"}],[\"$\",\"h1\",null,{\"className\":\"mt-3 text-lg font-bold tracking-tight\",\"children\":\"This page went missing\"}],[\"$\",\"p\",null,{\"className\":\"mt-1 max-w-sm text-sm text-muted-foreground\",\"children\":\"The page you're looking for doesn't exist or has been moved.\"}],[\"$\",\"div\",null,{\"className\":\"mt-5 flex flex-wrap justify-center gap-2\",\"children\":[[\"$\",\"$L1b\",null,{\"href\":\"/\",\"className\":\"rounded-md bg-gradient-theme px-4 py-2 text-sm font-medium text-white\",\"children\":\"Back home\"}],[\"$\",\"$L1b\",null,{\"href\":\"/projects\",\"className\":\"rounded-md border border-line bg-card px-4 py-2 text-sm font-medium transition-colors hover:bg-muted\",\"children\":\"View projects\"}]]}]]}],\"children\":[\"$\",\"$L1d\",null,{\"children\":[\"$\",\"$L1f\",null,{\"children\":[[\"$\",\"$Ld\",null,{\"providerId\":\"page:/\",\"segmentMap\":{\"children\":[\"__PAGE__\"]},\"children\":[\"$\",\"$L18\",null,{\"id\":\"page:/\"}]}],null]}]}]}]}]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("20:I[\"8c0f216c4604\",[],\"Children\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("21:I[\"d35d75d49457\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("25:I[\"b4c976f12461\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("26:I[\"ecd23f451e1e\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("13:[\"$\",\"main\",null,{\"id\":\"main-content\",\"className\":\"flex-1\",\"children\":[\"$\",\"$L20\",null,{}]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("14:[\"$\",\"div\",null,{\"aria-hidden\":true,\"className\":\"rail w-2 shrink-0 border-x border-line sm:w-3.5 lg:w-5\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("15:[\"$\",\"footer\",null,{\"className\":\"border-x border-t border-line bg-page\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid border-b border-line lg:grid-cols-[1.15fr_.85fr]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"border-b border-line p-5 sm:p-7 lg:border-r lg:border-b-0\",\"children\":[[\"$\",\"svg\",null,{\"aria-hidden\":true,\"viewBox\":\"0 0 72 72\",\"className\":\"size-11\",\"fill\":\"none\",\"children\":[[\"$\",\"rect\",null,{\"x\":\"0.5\",\"y\":\"0.5\",\"width\":\"71\",\"height\":\"71\",\"rx\":\"8\",\"className\":\"fill-card stroke-line\"}],[\"$\",\"path\",null,{\"d\":\"M13 48V23h6l7 10 7-10h6v25h-7V35l-6 9-6-9v13Z\",\"className\":\"fill-foreground\"}],[\"$\",\"path\",null,{\"d\":\"M43 48V23h17v6H50v4h9v6h-9v9Z\",\"className\":\"fill-theme-1\"}],[\"$\",\"path\",null,{\"d\":\"M7 58h58\",\"className\":\"stroke-line-strong\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-5 max-w-xl text-2xl font-semibold tracking-[-0.04em] sm:text-3xl\",\"children\":\"Have a product interface that needs a careful frontend build?\"}],[\"$\",\"p\",null,{\"className\":\"mt-3 max-w-lg text-sm leading-6 text-muted-foreground\",\"children\":\"I am available for freelance and remote projects, from focused landing pages to interactive product experiences.\"}],[\"$\",\"$L1b\",null,{\"href\":\"/contact\",\"className\":\"theme-action mt-6 inline-flex h-11 items-center gap-2 px-4 text-sm font-semibold\",\"children\":[\"Start a conversation\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":16,\"height\":16,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-up-right\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M17 7l-10 10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7l9 0l0 9\"}],\"$undefined\"]}]]}]]}],[\"$\",\"div\",null,{\"className\":\"grid grid-cols-2 sm:grid-cols-3\",\"children\":[[\"$\",\"nav\",\"Work\",{\"aria-label\":\"Work links\",\"className\":\"border-r border-line p-5 last:border-r-0 sm:p-6\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-[9px] uppercase tracking-[0.18em] text-muted-foreground\",\"children\":\"Work\"}],[\"$\",\"div\",null,{\"className\":\"mt-4 grid gap-3\",\"children\":[[\"$\",\"$L1b\",\"/projects\",{\"href\":\"/projects\",\"className\":\"w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline\",\"children\":\"Projects\"}],[\"$\",\"$L1b\",\"/components\",{\"href\":\"/components\",\"className\":\"w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline\",\"children\":\"Components\"}],[\"$\",\"$L1b\",\"/tools\",{\"href\":\"/tools\",\"className\":\"w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline\",\"children\":\"Tools\"}]]}]]}],[\"$\",\"nav\",\"Explore\",{\"aria-label\":\"Explore links\",\"className\":\"border-r border-line p-5 last:border-r-0 sm:p-6\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-[9px] uppercase tracking-[0.18em] text-muted-foreground\",\"children\":\"Explore\"}],[\"$\",\"div\",null,{\"className\":\"mt-4 grid gap-3\",\"children\":[[\"$\",\"$L1b\",\"/blog\",{\"href\":\"/blog\",\"className\":\"w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline\",\"children\":\"Blog\"}],[\"$\",\"$L1b\",\"/experience\",{\"href\":\"/experience\",\"className\":\"w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline\",\"children\":\"Experience\"}],[\"$\",\"$L1b\",\"/resources\",{\"href\":\"/resources\",\"className\":\"w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline\",\"children\":\"Resources\"}]]}]]}],[\"$\",\"nav\",\"Connect\",{\"aria-label\":\"Connect links\",\"className\":\"border-r border-line p-5 last:border-r-0 sm:p-6\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-[9px] uppercase tracking-[0.18em] text-muted-foreground\",\"children\":\"Connect\"}],[\"$\",\"div\",null,{\"className\":\"mt-4 grid gap-3\",\"children\":[[\"$\",\"$L1b\",\"/inspirations\",{\"href\":\"/inspirations\",\"className\":\"w-fit text-sm text-muted-foreground underline-offset-4 hover:text-foreground hover:underline\",\"children\":\"Inspirations\"}]]}]]}]]}]]}],[\"$\",\"$L21\",null,{\"className\":\"border-b border-line px-4 py-7 sm:py-9\",\"children\":[\"$\",\"p\",null,{\"className\":\"iso-title text-[clamp(2.25rem,9vw,5.5rem)]\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"iso-title-layer iso-title-back\",\"children\":\"Mudasir Fayaz\"}],\"$L22\",\"$L23\"]}]}],\"$L24\"]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("16:[\"$\",\"$L25\",null,{}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("17:[\"$\",\"$L26\",null,{}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("1:[[\"$\",\"section\",null,{\"id\":\"home\",\"aria-labelledby\":\"home-title\",\"children\":[[\"$\",\"$L21\",null,{\"children\":[\"$\",\"figure\",null,{\"aria-labelledby\":\"mf-figure-title\",\"className\":\"relative border-y border-line\",\"children\":[[\"$\",\"svg\",null,{\"viewBox\":\"0 0 640 400\",\"preserveAspectRatio\":\"xMidYMid meet\",\"role\":\"img\",\"className\":\"relative block aspect-[8/5] w-full lg:hidden\",\"aria-labelledby\":\"mf-figure-title mf-figure-description\",\"children\":[[\"$\",\"title\",null,{\"id\":\"mf-figure-title\",\"children\":\"M F isometric monogram\"}],[\"$\",\"desc\",null,{\"id\":\"mf-figure-description\",\"children\":\"A custom vector monogram for Mudasir Fayaz drawn on a restrained construction grid.\"}],[\"$\",\"defs\",null,{\"children\":[\"$\",\"pattern\",null,{\"id\":\"mf-hatch\",\"width\":\"10\",\"height\":\"10\",\"patternUnits\":\"userSpaceOnUse\",\"patternTransform\":\"rotate(45)\",\"children\":[\"$\",\"path\",null,{\"d\":\"M0 0V10\",\"className\":\"stroke-theme-3\",\"strokeWidth\":\"3\"}]}]}],[\"$\",\"g\",null,{\"className\":\"stroke-line-strong\",\"fill\":\"none\",\"strokeWidth\":\"1.25\",\"strokeDasharray\":\"6 8\",\"opacity\":\"0.8\",\"children\":[[\"$\",\"path\",\"M28 196H612\",{\"d\":\"M28 196H612\"}],[\"$\",\"path\",\"M320 26V372\",{\"d\":\"M320 26V372\"}],[\"$\",\"path\",\"M74 288 566 104\",{\"d\":\"M74 288 566 104\"}],[\"$\",\"path\",\"M74 104 566 288\",{\"d\":\"M74 104 566 288\"}]]}],[\"$\",\"g\",null,{\"transform\":\"translate(320 196) skewX(-15) scale(0.96) translate(-175 -80)\",\"children\":[[\"$\",\"g\",null,{\"transform\":\"translate(18 -16)\",\"className\":\"fill-theme-1\",\"opacity\":\"0.7\",\"children\":[[\"$\",\"path\",null,{\"d\":\"M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z\"}],[\"$\",\"path\",null,{\"d\":\"M200 160V0H350V40H244V66H332V106H244V160Z\"}]]}],[\"$\",\"g\",null,{\"transform\":\"translate(9 -8)\",\"className\":\"fill-surface stroke-line-strong\",\"strokeWidth\":\"1\",\"children\":[[\"$\",\"path\",null,{\"d\":\"M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z\"}],[\"$\",\"path\",null,{\"d\":\"M200 160V0H350V40H244V66H332V106H244V160Z\"}]]}],[\"$\",\"g\",null,{\"className\":\"stroke-foreground\",\"strokeWidth\":\"1.6\",\"children\":[[\"$\",\"path\",null,{\"d\":\"M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z\",\"fill\":\"var(--card)\"}],[\"$\",\"path\",null,{\"d\":\"M200 160V0H350V40H244V66H332V106H244V160Z\",\"fill\":\"url(#mf-hatch)\"}]]}]]}],[\"$\",\"g\",null,{\"className\":\"fill-muted-foreground font-mono text-[11px] tracking-[0.16em]\",\"children\":[[\"$\",\"text\",null,{\"x\":\"28\",\"y\":\"36\",\"children\":\"FIG. 01 / IDENTITY\"}],[\"$\",\"text\",null,{\"x\":\"612\",\"y\":\"36\",\"textAnchor\":\"end\",\"children\":\"ISOMETRIC / 30°\"}],[\"$\",\"text\",null,{\"x\":\"28\",\"y\":\"378\",\"children\":\"MUDASIR FAYAZ\"}],[\"$\",\"text\",null,{\"x\":\"612\",\"y\":\"378\",\"textAnchor\":\"end\",\"children\":\"MF / 2026\"}]]}],[\"$\",\"g\",null,{\"className\":\"fill-theme-1\",\"children\":[[\"$\",\"circle\",null,{\"cx\":\"320\",\"cy\":\"196\",\"r\":\"3.5\"}],[\"$\",\"circle\",null,{\"cx\":\"320\",\"cy\":\"26\",\"r\":\"3\"}],[\"$\",\"circle\",null,{\"cx\":\"320\",\"cy\":\"372\",\"r\":\"3\"}],[\"$\",\"circle\",null,{\"cx\":\"74\",\"cy\":\"104\",\"r\":\"3\"}],[\"$\",\"circle\",null,{\"cx\":\"566\",\"cy\":\"104\",\"r\":\"3\"}]]}]]}],[\"$\",\"svg\",null,{\"viewBox\":\"0 0 1200 340\",\"preserveAspectRatio\":\"xMidYMid meet\",\"role\":\"img\",\"className\":\"relative hidden aspect-[60/17] w-full lg:block\",\"aria-labelledby\":\"mf-figure-title-wide mf-figure-description-wide\",\"children\":[[\"$\",\"title\",null,{\"id\":\"mf-figure-title-wide\",\"children\":\"M F isometric monogram\"}],[\"$\",\"desc\",null,{\"id\":\"mf-figure-description-wide\",\"children\":\"A wide isometric construction drawing of the Mudasir Fayaz monogram with measurement guides.\"}],[\"$\",\"defs\",null,{\"children\":[\"$\",\"pattern\",null,{\"id\":\"mf-hatch-wide\",\"width\":\"10\",\"height\"
80:\"10\",\"patternUnits\":\"userSpaceOnUse\",\"patternTransform\":\"rotate(45)\",\"children\":[\"$\",\"path\",null,{\"d\":\"M0 0V10\",\"className\":\"stroke-theme-3\",\"strokeWidth\":\"3\"}]}]}],[\"$\",\"g\",null,{\"className\":\"stroke-line-strong\",\"fill\":\"none\",\"strokeWidth\":\"1.25\",\"strokeDasharray\":\"6 8\",\"opacity\":\"0.8\",\"children\":[[\"$\",\"path\",\"M40 170H1160\",{\"d\":\"M40 170H1160\"}],[\"$\",\"path\",\"M600 24V336\",{\"d\":\"M600 24V336\"}],[\"$\",\"path\",\"M180 262 1020 78\",{\"d\":\"M180 262 1020 78\"}],[\"$\",\"path\",\"M180 78 1020 262\",{\"d\":\"M180 78 1020 262\"}]]}],[\"$\",\"g\",null,{\"transform\":\"translate(600 170) skewX(-15) scale(1.02 0.82) translate(-175 -80)\",\"children\":[[\"$\",\"g\",null,{\"transform\":\"translate(20 -18)\",\"className\":\"fill-theme-1\",\"opacity\":\"0.7\",\"children\":[[\"$\",\"path\",null,{\"d\":\"M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z\"}],[\"$\",\"path\",null,{\"d\":\"M200 160V0H350V40H244V66H332V106H244V160Z\"}]]}],[\"$\",\"g\",null,{\"transform\":\"translate(10 -9)\",\"className\":\"fill-surface stroke-line-strong\",\"strokeWidth\":\"1\",\"children\":[[\"$\",\"path\",null,{\"d\":\"M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z\"}],\"$L27\"]}],\"$L28\"]}],\"$L29\",\"$L2a\"]}],\"$L2b\"]}]}],\"$L2c\",\"$L2d\",\"$L2e\"]}],\"$L2f\",\"$L30\",\"$L31\",\"$L32\",\"$L33\",\"$L34\",\"$L35\"]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("36:I[\"f8faf06f5bb0\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("37:I[\"48338c8c4b83\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("38:I[\"9fb86276be8f\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("5d:I[\"52624f8f3941\",[],\"default\",1]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("22:[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"iso-title-layer iso-title-mid\",\"children\":\"Mudasir Fayaz\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("23:[\"$\",\"span\",null,{\"className\":\"iso-title-layer iso-title-front\",\"children\":\"Mudasir Fayaz\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("24:[\"$\",\"div\",null,{\"className\":\"grid gap-px bg-line sm:grid-cols-[1fr_auto_1fr]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-wrap items-center gap-x-4 gap-y-2 bg-page px-4 py-3 font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"className\":\"inline-flex items-center gap-2\",\"children\":[[\"$\",\"span\",null,{\"className\":\"size-1.5 bg-emerald-500\",\"aria-hidden\":true}],\"Available for work\"]}],[\"$\",\"$L36\",null,{}],[\"$\",\"$L37\",null,{}]]}],[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center gap-1 bg-page px-4 py-2\",\"children\":[[\"$\",\"a\",\"GitHub\",{\"href\":\"https://github.com/Mudasir-Fayaz\",\"aria-label\":\"GitHub\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex size-8 items-center justify-center text-muted-foreground hover:bg-chip hover:text-foreground\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-brand-github\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5\"}],\"$undefined\"]}]}],[\"$\",\"a\",\"LinkedIn\",{\"href\":\"https://linkedin.com/in/Mudasir-Fayaz\",\"aria-label\":\"LinkedIn\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex size-8 items-center justify-center text-muted-foreground hover:bg-chip hover:text-foreground\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-brand-linkedin\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M8 11v5\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 8v.01\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M12 16v-5\"}],[\"$\",\"path\",\"svg-3\",{\"d\":\"M16 16v-3a2 2 0 1 0 -4 0\"}],[\"$\",\"path\",\"svg-4\",{\"d\":\"M3 7a4 4 0 0 1 4 -4h10a4 4 0 0 1 4 4v10a4 4 0 0 1 -4 4h-10a4 4 0 0 1 -4 -4l0 -10\"}],\"$undefined\"]}]}],[\"$\",\"a\",\"X\",{\"href\":\"https://x.com/mudasirbuilds\",\"aria-label\":\"X\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex size-8 items-center justify-center text-muted-foreground hover:bg-chip hover:text-foreground\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-brand-x\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M4 4l11.733 16h4.267l-11.733 -16l-4.267 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M4 20l6.768 -6.768m2.46 -2.46l6.772 -6.772\"}],\"$undefined\"]}]}],[\"$\",\"a\",\"Email\",{\"href\":\"mailto:[email protected]\",\"aria-label\":\"Email\",\"target\":\"$undefined\",\"rel\":\"$undefined\",\"className\":\"inline-flex size-8 items-center justify-center text-muted-foreground hover:bg-chip hover:text-foreground\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-mail\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M3 7l9 6l9 -6\"}],\"$undefined\"]}]}]]}],[\"$\",\"p\",null,{\"className\":\"bg-page px-4 py-3 text-right font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground\",\"children\":[\"Next.js / vinext / Cloudflare / \",2026]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("27:[\"$\",\"path\",null,{\"d\":\"M200 160V0H350V40H244V66H332V106H244V160Z\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("28:[\"$\",\"g\",null,{\"className\":\"stroke-foreground\",\"strokeWidth\":\"1.6\",\"children\":[[\"$\",\"path\",null,{\"d\":\"M0 160V0H38L82 70L126 0H164V160H120V70L82 130L44 70V160Z\",\"fill\":\"var(--card)\"}],[\"$\",\"path\",null,{\"d\":\"M200 160V0H350V40H244V66H332V106H244V160Z\",\"fill\":\"url(#mf-hatch-wide)\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("29:[\"$\",\"g\",null,{\"className\":\"fill-muted-foreground font-mono text-[11px] tracking-[0.16em]\",\"children\":[[\"$\",\"text\",null,{\"x\":\"40\",\"y\":\"38\",\"children\":\"FIG. 01 / IDENTITY SYSTEM\"}],[\"$\",\"text\",null,{\"x\":\"1160\",\"y\":\"38\",\"textAnchor\":\"end\",\"children\":\"ISOMETRIC / 30° / SCALE 1:1\"}],[\"$\",\"text\",null,{\"x\":\"40\",\"y\":\"316\",\"children\":\"MUDASIR FAYAZ / FRONTEND ENGINEER\"}],[\"$\",\"text\",null,{\"x\":\"1160\",\"y\":\"316\",\"textAnchor\":\"end\",\"children\":\"MF / 2026\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("2a:[\"$\",\"g\",null,{\"className\":\"fill-theme-1\",\"children\":[[\"$\",\"circle\",null,{\"cx\":\"600\",\"cy\":\"170\",\"r\":\"4\"}],[\"$\",\"circle\",null,{\"cx\":\"600\",\"cy\":\"24\",\"r\":\"3\"}],[\"$\",\"circle\",null,{\"cx\":\"600\",\"cy\":\"336\",\"r\":\"3\"}],[\"$\",\"circle\",null,{\"cx\":\"180\",\"cy\":\"78\",\"r\":\"3\"}],[\"$\",\"circle\",null,{\"cx\":\"1020\",\"cy\":\"78\",\"r\":\"3\"}],[\"$\",\"circle\",null,{\"cx\":\"180\",\"cy\":\"262\",\"r\":\"3\"}],[\"$\",\"circle\",null,{\"cx\":\"1020\",\"cy\":\"262\",\"r\":\"3\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("2b:[\"$\",\"figcaption\",null,{\"className\":\"relative flex items-center justify-between gap-4 border-t border-line px-4 py-2 font-mono text-[10px] uppercase tracking-[0.16em] text-muted-foreground sm:px-5\",\"children\":[[\"$\",\"span\",null,{\"children\":\"Monogram study\"}],[\"$\",\"span\",null,{\"aria-hidden\":true,\"children\":\"Construction grid\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("2c:[\"$\",\"div\",null,{\"className\":\"grid border-b border-line lg:grid-cols-[1.18fr_.82fr]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"min-w-0 border-b border-line p-4 sm:p-6 lg:border-r lg:border-b-0\",\"children\":[[\"$\",\"span\",null,{\"className\":\"figure-label\",\"children\":\"Profile / 01\"}],[\"$\",\"div\",null,{\"className\":\"mt-5 flex items-start gap-4 sm:gap-5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"relative size-16 shrink-0 overflow-hidden border border-line sm:size-20\",\"children\":[\"$\",\"$L38\",null,{\"src\":\"/profile_pic.webp\",\"alt\":\"Mudasir Fayaz\",\"fill\":true,\"priority\":true,\"sizes\":\"80px\",\"className\":\"object-cover\"}]}],[\"$\",\"div\",null,{\"className\":\"min-w-0\",\"children\":[[\"$\",\"h1\",null,{\"id\":\"home-title\",\"className\":\"text-3xl font-semibold tracking-[-0.05em] sm:text-5xl\",\"children\":\"Mudasir Fayaz\"}],[\"$\",\"p\",null,{\"className\":\"mt-1 font-mono text-[10px] uppercase tracking-[0.16em] text-theme-1 sm:text-xs\",\"children\":\"Frontend Engineer / Design-minded builder\"}]]}]]}],[\"$\",\"p\",null,{\"className\":\"mt-6 max-w-2xl text-base leading-7 text-muted-foreground sm:text-lg\",\"children\":\"I build clear, fast interfaces for products that need thoughtful interaction design and production-ready frontend engineering.\"}],[\"$\",\"div\",null,{\"className\":\"mt-5 flex flex-wrap gap-2\",\"children\":[[\"$\",\"$L1b\",null,{\"href\":\"/contact\",\"className\":\"theme-action inline-flex h-11 items-center gap-2 px-4 text-sm font-semibold\",\"children\":[\"Let's work together\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":16,\"height\":16,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-up-right\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M17 7l-10 10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7l9 0l0 9\"}],\"$undefined\"]}]]}],[\"$\",\"a\",null,{\"href\":\"mailto:[email protected]\",\"className\":\"inline-flex h-11 items-center gap-2 border border-line bg-card px-4 text-sm font-medium text-muted-foreground hover:border-line-strong hover:text-foreground\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":16,\"height\":16,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-mail\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M3 7l9 6l9 -6\"}],\"$undefined\"]}],\"Email me\"]}]]}]]}],[\"$\",\"div\",null,{\"className\":\"grid grid-cols-2 content-start\",\"children\":[[[\"$\",\"div\",\"Role\",{\"className\":\"border-r border-b border-line p-3.5 even:border-r-0 sm:p-4\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground\",\"children\":\"Role\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 text-sm font-medium leading-5\",\"children\":\"Frontend Engineer\"}]]}],[\"$\",\"div\",\"Base\",{\"className\":\"border-r border-b border-line p-3.5 even:border-r-0 sm:p-4\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground\",\"children\":\"Base\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 text-sm font-medium leading-5\",\"children\":\"Kashmir, India\"}]]}],[\"$\",\"div\",\"Focus\",{\"className\":\"border-r border-b border-line p-3.5 even:border-r-0 sm:p-4\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground\",\"children\":\"Focus\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 text-sm font-medium leading-5\",\"children\":\"React / Next.js\"}]]}],[\"$\",\"div\",\"Archive\",{\"className\":\"border-r border-b border-line p-3.5 even:border-r-0 sm:p-4\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground\",\"children\":\"Archive\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 text-sm font-medium leading-5\",\"children\":\"18 projects\"}]]}]],[\"$\",\"div\",null,{\"className\":\"border-r border-line p-3.5 sm:p-4\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground\",\"children\":\"Local time\"}],[\"$\",\"$L36\",null,{\"className\":\"mt-2 block text-sm font-medium\"}]]}],\"$L39\"]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("2d:[\"$\",\"div\",null,{\"className\":\"grid border-b border-line lg:grid-cols-[.82fr_1.18fr]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"min-w-0 border-b border-line p-4 sm:p-6 lg:border-r lg:border-b-0\",\"children\":[[\"$\",\"span\",null,{\"className\":\"figure-label\",\"children\":\"About / 02\"}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-lg leading-7 font-medium tracking-[-0.025em] sm:text-xl sm:leading-8\",\"children\":\"Building responsive interfaces with a focus on clear systems, useful motion, and dependable delivery.\"}]]}],[\"$\",\"div\",null,{\"className\":\"p-4 sm:p-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-4\",\"children\":[[\"$\",\"span\",null,{\"className\":\"figure-label\",\"children\":\"Working stack\"}],[\"$\",\"a\",null,{\"href\":\"https://github.com/Mudasir-Fayaz\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-brand-github\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5\"}],\"$undefined\"]}],\"GitHub\"]}]]}],[\"$\",\"div\",null,{\"className\":\"mt-4 flex flex-wrap gap-2\",\"children\":[[\"$\",\"span\",\"React\",{\"className\":\"border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"React\"}],[\"$\",\"span\",\"Next.js\",{\"className\":\"border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Next.js\"}],[\"$\",\"span\",\"Tailwind CSS\",{\"className\":\"border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Tailwind CSS\"}],[\"$\",\"span\",\"Motion\",{\"className\":\"border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Motion\"}],[\"$\",\"span\",\"Supabase\",{\"className\":\"border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Supabase\"}],[\"$\",\"span\",\"MongoDB\",{\"className\":\"border border-line bg-chip px-2.5 py-1.5 font-mono text-[10px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"MongoDB\"}]]}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("2e:[\"$\",\"div\",null,{\"aria-hidden\":true,\"className\":\"hatched-divider \"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("2f:[\"$\",\"section\",null,{\"id\":\"projects\",\"aria-labelledby\":\"selected-work-title\",\"className\":\"border-b border-line\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7\",\"children\":[[\"$\",\"div\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"figure-label\",\"children\":\"Projects / 03\"}],[\"$\",\"h2\",null,{\"id\":\"selected-work-title\",\"className\":\"mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl\",\"children\":\"Selected work\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 max-w-2xl text-sm leading-6 text-muted-foreground\",\"children\":\"A focused selection from the project archive.\"}]]}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"grid gap-3 bg-page p-3 sm:grid-cols-2 sm:p-4 lg:grid-cols-3\",\"children\":[[\"$\",\"div\",\"SJ Polyclinics\",{\"className\":\"border border-line\",\"children\":[\"$\",\"article\",null,{\"className\":\"group h-full bg-card p-3 sm:p-4\",\"children\":[\"$\",\"$L1b\",null,{\"href\":\"https://sjpolyclinics.com\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"flex h-full flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"iso-frame\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"iso-frame-plate\"}],[\"$\",\"div\",null,{\"className\":\"iso-frame-media relative aspect-[16/10]\",\"children\":[[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/projects/sjpolyclinics.webp\",\"alt\":\"SJ Polyclinics - project by Mudasir Fayaz\",\"fill\":true,\"sizes\":\"(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw\",\"loading\":\"lazy\",\"className\":\"object-cover\"}],[\"$\",\"span\",null,{\"className\":\"absolute top-3 left-3 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.12em]\",\"children\":\"Healthcare\"}],null]}]]}],[\"$\",\"div\",null,{\"className\":\"flex flex-1 flex-col pt-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-start justify-between gap-4\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-semibold tracking-[-0.02em] group-hover:text-theme-1\",\"children\":\"SJ Polyclinics\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":16,\"height\":16,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-up-right shrink-0 text-muted-foreground group-hover:text-theme-1\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M17 7l-10 10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7l9 0l0 9\"}],\"$undefined\"]}]]}],[\"$\",\"p\",null,{\"className\":\"mt-2 text-sm leading-6 text-muted-foreground\",\"children\":\"Polyclinic website with online appointment booking \u0026 management features.\"}],[\"$\",\"div\",null,{\"className\":\"mt-auto flex flex-wrap gap-1.5 pt-5\",\"children\":[[[\"$\",\"span\",\"ReactJS\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"ReactJS\"}],[\"$\",\"span\",\"NextJS\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"NextJS\"}],[\"$\",\"span\",\"Tailwind\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"Tailwind\"}],[\"$\",\"span\",\"Motion\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"Motion\"}]],[\"$\",\"span\",null,{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] text-muted-foreground\",\"children\":[\"+\",1]}]]}],[\"$\",\"span\",null,{\"className\":\"mt-5 inline-flex items-center gap-1.5 border-t border-line pt-3 text-xs font-medium\",\"children\":[\"View project \",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\"
80:14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-up-right\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M17 7l-10 10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7l9 0l0 9\"}],\"$undefined\"]}]]}]]}]]}]}]}],[\"$\",\"div\",\"MedScan Ultrasounds\",{\"className\":\"border border-line\",\"children\":[\"$\",\"article\",null,{\"className\":\"group h-full bg-card p-3 sm:p-4\",\"children\":\"$L3a\"}]}],\"$L3b\"]}],\"$L3c\",\"$L3d\"]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("30:[\"$\",\"section\",null,{\"id\":\"components\",\"aria-labelledby\":\"component-lab-title\",\"className\":\"border-b border-line\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7\",\"children\":[[\"$\",\"div\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"figure-label\",\"children\":\"Components / 04\"}],[\"$\",\"h2\",null,{\"id\":\"component-lab-title\",\"className\":\"mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl\",\"children\":\"Component lab\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 max-w-2xl text-sm leading-6 text-muted-foreground\",\"children\":\"React components with live previews and copyable source.\"}]]}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"grid gap-px bg-line sm:grid-cols-2 lg:grid-cols-3\",\"children\":[[\"$\",\"$L1b\",\"animated-button\",{\"href\":\"/components/animated-button\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-code\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M7 8l-4 4l4 4\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17 8l4 4l-4 4\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M14 4l-4 16\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Animated Button\"}]]}],[\"$\",\"$L1b\",\"feature-card\",{\"href\":\"/components/feature-card\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-code\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M7 8l-4 4l4 4\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17 8l4 4l-4 4\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M14 4l-4 16\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Feature Card\"}]]}],[\"$\",\"$L1b\",\"testimonial-card\",{\"href\":\"/components/testimonial-card\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-code\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M7 8l-4 4l4 4\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17 8l4 4l-4 4\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M14 4l-4 16\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Testimonial Card\"}]]}],[\"$\",\"$L1b\",\"pricing-card\",{\"href\":\"/components/pricing-card\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\"
80:15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-code\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M7 8l-4 4l4 4\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17 8l4 4l-4 4\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M14 4l-4 16\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Pricing Card\"}]]}],[\"$\",\"$L1b\",\"progress-bar\",{\"href\":\"/components/progress-bar\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[\"$L3e\",\"$L3f\"]}],\"$L40\"]}],\"$L41\"]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("31:[\"$\",\"section\",null,{\"id\":\"tools\",\"aria-labelledby\":\"utility-tools-title\",\"className\":\"border-b border-line\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7\",\"children\":[[\"$\",\"div\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"figure-label\",\"children\":\"Tools / 05\"}],[\"$\",\"h2\",null,{\"id\":\"utility-tools-title\",\"className\":\"mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl\",\"children\":\"Utility tools\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 max-w-2xl text-sm leading-6 text-muted-foreground\",\"children\":\"Browser tools for everyday frontend work.\"}]]}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"grid gap-px bg-line sm:grid-cols-2 lg:grid-cols-3\",\"children\":[[\"$\",\"$L1b\",\"color-picker\",{\"href\":\"/tools/color-picker\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-palette\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M12 21a9 9 0 0 1 0 -18c4.97 0 9 3.582 9 8c0 1.06 -.474 2.078 -1.318 2.828c-.844 .75 -1.989 1.172 -3.182 1.172h-2.5a2 2 0 0 0 -1 3.75a1.3 1.3 0 0 1 -1 2.25\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M7.5 10.5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M11.5 7.5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\"}],[\"$\",\"path\",\"svg-3\",{\"d\":\"M15.5 10.5a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Color Picker\"}]]}],[\"$\",\"$L1b\",\"contrast-checker\",{\"href\":\"/tools/contrast-checker\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-contrast\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M12 17a5 5 0 0 0 0 -10v10\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Contrast Checker\"}]]}],[\"$\",\"$L1b\",\"gradient-generator\",{\"href\":\"/tools/gradient-generator\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-gradienter\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3.227 14c.917 4 4.497 7 8.773 7c4.277 0 7.858 -3 8.773 -7\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M20.78 10a9 9 0 0 0 -8.78 -7a8.985 8.985 0 0 0 -8.782 7\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M10 12a2 2 0 1 0 4 0a2 2 0 1 0 -4 0\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Gradient Generator\"}]]}],[\"$\",\"$L1b\",\"shadow-generator\",{\"href\":\"/tools/shadow-generator\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\"
80:15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-stack-2\",\"aria-hidden\":true,\"children\":[\"$undefined\",\"$L42\",\"$L43\",\"$L44\",\"$undefined\"]}]}],\"$L45\"]}],\"$L46\",\"$L47\"]}],\"$L48\"]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("32:[\"$\",\"section\",null,{\"id\":\"blog\",\"aria-labelledby\":\"writing-title\",\"className\":\"border-b border-line\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7\",\"children\":[[\"$\",\"div\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"figure-label\",\"children\":\"Writing / 06\"}],[\"$\",\"h2\",null,{\"id\":\"writing-title\",\"className\":\"mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl\",\"children\":\"Notes\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 max-w-2xl text-sm leading-6 text-muted-foreground\",\"children\":\"Short writing on frontend systems and performance.\"}]]}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"grid gap-px bg-line sm:grid-cols-2 lg:grid-cols-3\",\"children\":[[\"$\",\"article\",\"serverless-file-uploads-with-supabase-storage-and-nextjs-api-routes\",{\"className\":\"group h-full bg-card p-3 sm:p-4\",\"children\":[\"$\",\"$L1b\",null,{\"href\":\"/blog/serverless-file-uploads-with-supabase-storage-and-nextjs-api-routes\",\"className\":\"flex h-full flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"iso-frame\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"iso-frame-plate\"}],[\"$\",\"div\",null,{\"className\":\"iso-frame-media relative aspect-[16/9]\",\"children\":[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/blog/serverless-file-uploads-with-supabase-storage-and-nextjs-api-routes.webp\",\"alt\":\"\",\"fill\":true,\"sizes\":\"(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw\",\"loading\":\"lazy\",\"className\":\"object-cover\"}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex flex-1 flex-col pt-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-wrap items-center justify-between gap-3 font-mono text-[9px] uppercase tracking-[0.1em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"className\":\"flex flex-wrap items-center gap-3\",\"children\":[[\"$\",\"time\",null,{\"children\":\"02 Oct 2025\"}],[\"$\",\"span\",null,{\"className\":\"inline-flex items-center gap-1\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":12,\"height\":12,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-clock\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M12 7v5l3 3\"}],\"$undefined\"]}],1,\" min\"]}]]}],[\"$\",\"span\",null,{\"children\":[\"NOTE-\",\"01\"]}]]}],[\"$\",\"h3\",null,{\"className\":\"mt-4 text-base font-semibold leading-6 tracking-[-0.02em] group-hover:text-theme-1\",\"children\":\"Serverless file uploads with Supabase Storage and Next.js API routes\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 line-clamp-2 text-xs leading-5 text-muted-foreground\",\"children\":\"Secure, serverless file uploads in Next.js using Supabase Storage, with validation, size limits, and public access handling.\"}],[\"$\",\"div\",null,{\"className\":\"mt-4 flex items-center gap-1.5 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"className\":\"border border-line bg-page px-2 py-1\",\"children\":\"next.js\"}],[\"$\",\"span\",null,{\"children\":[\"+\",3]}]]}],[\"$\",\"span\",null,{\"className\":\"mt-auto flex items-center gap-1.5 pt-5 text-xs font-medium\",\"children\":[\"Read note \",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-right\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M5 12l14 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M13 18l6 -6\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M13 6l6 6\"}],\"$undefined\"]}]]}]]}]]}]}],[\"$\",\"article\",\"building-modern-todo-app-with-zustand-firebase-and-nextjs\",{\"className\":\"group h-full bg-card p-3 sm:p-4\",\"children\":[\"$\",\"$L1b\",null,{\"href\":\"/blog/building-modern-todo-app-with-zustand-firebase-and-nextjs\",\"className\":\"flex h-full flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"iso-frame\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"iso-frame-plate\"}],[\"$\",\"div\",null,{\"className\":\"iso-frame-media relative aspect-[16/9]\",\"children\":[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/blog/building-modern-todo-app-with-zustand-firebase-and-nextjs.webp\",\"alt\":\"\",\"fill\":true,\"sizes\":\"(max-width: 640px) 100v
80w, (max-width: 1024px) 50vw, 33vw\",\"loading\":\"lazy\",\"className\":\"object-cover\"}]}]]}],\"$L49\"]}]}],\"$L4a\"]}],\"$L4b\"]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("33:[\"$\",\"section\",null,{\"id\":\"experience\",\"aria-labelledby\":\"experience-title\",\"className\":\"border-b border-line\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7\",\"children\":[[\"$\",\"div\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"figure-label\",\"children\":\"Experience / 07\"}],[\"$\",\"h2\",null,{\"id\":\"experience-title\",\"className\":\"mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl\",\"children\":\"Experience\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 max-w-2xl text-sm leading-6 text-muted-foreground\",\"children\":\"Recent engagements and products, newest first.\"}]]}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"px-4 py-6 sm:px-7 sm:py-8\",\"children\":[\"$\",\"ol\",null,{\"className\":\"relative\",\"children\":[[\"$\",\"li\",\"sj-polyclinics\",{\"className\":\"relative pl-6 sm:pl-10 pb-5 sm:pb-6\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"absolute top-9 bottom-0 left-[3px] w-px bg-line\"}],[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"absolute top-[30px] left-0 size-[7px] bg-theme-1\"}],[\"$\",\"article\",null,{\"className\":\"border border-line bg-card p-4 sm:p-5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-start justify-between gap-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"min-w-0\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-semibold tracking-[-0.02em] sm:text-lg\",\"children\":[\"$\",\"a\",null,{\"href\":\"https://sjpolyclinics.com\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex items-center gap-1.5 hover:text-theme-1\",\"children\":[\"SJ Polyclinics\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-external-link\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M11 13l9 -9\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M15 4h5v5\"}],\"$undefined\"]}]]}]}],[\"$\",\"p\",null,{\"className\":\"mt-1.5 inline-flex items-center gap-1.5 font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":13,\"height\":13,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-map-pin\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M9 11a3 3 0 1 0 6 0a3 3 0 0 0 -6 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17.657 16.657l-4.243 4.243a2 2 0 0 1 -2.827 0l-4.244 -4.243a8 8 0 1 1 11.314 0\"}],\"$undefined\"]}],\"Kashmir, India\"]}]]}],[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"flex size-11 shrink-0 items-center justify-center border border-line bg-chip font-mono text-xs font-semibold text-foreground sm:size-12\",\"children\":\"SJ\"}]]}],[\"$\",\"div\",null,{\"className\":\"mt-4 flex flex-wrap items-center gap-x-3 gap-y-2\",\"children\":[[\"$\",\"span\",null,{\"className\":\"border border-line bg-chip px-2 py-0.5 font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground\",\"children\":\"Freelance\"}],[\"$\",\"p\",null,{\"className\":\"inline-flex items-center gap-2 text-sm font-medium\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-briefcase shrink-0 text-theme-1\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3 9a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v9a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2l0 -9\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7v-2a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v2\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M12 12l0 .01\"}],[\"$\",\"path\",\"svg-3\",{\"d\":\"M3 13a20 20 0 0 0 18 0\"}],\"$undefined\"]}],\"Frontend Engineer\"]}]]}],[\"$\",\"p\",null,{\"className\":\"mt-2 inline-flex items-center gap-2 font-mono text-xs text-muted-foreground\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":13,\"height\"
80:13,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-calendar\",\"aria-hidden\":true,\"children\":[\"$undefined\",\"$L4c\",\"$L4d\",\"$L4e\",\"$L4f\",\"$L50\",\"$L51\",\"$undefined\"]}],\"$L52\"]}],\"$L53\",\"$L54\",\"$L55\"]}]]}],\"$L56\",\"$L57\"]}]}],\"$L58\"]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("34:[\"$\",\"section\",null,{\"id\":\"testimonials\",\"aria-labelledby\":\"testimonials-title\",\"className\":\"border-b border-line\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid gap-5 border-b border-line px-4 py-6 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-end sm:px-7\",\"children\":[[\"$\",\"div\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"figure-label\",\"children\":\"References / 08\"}],[\"$\",\"h2\",null,{\"id\":\"testimonials-title\",\"className\":\"mt-3 text-2xl font-semibold tracking-[-0.035em] sm:text-3xl\",\"children\":\"Client notes\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 max-w-2xl text-sm leading-6 text-muted-foreground\",\"children\":\"Words from the people I have built with.\"}]]}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"grid gap-px bg-line md:grid-cols-2\",\"children\":[[\"$\",\"figure\",\"1\",{\"className\":\"flex min-h-56 flex-col bg-card p-5 sm:p-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-4 font-mono text-[9px] uppercase tracking-[0.14em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"Note \",\"01\"]}],[\"$\",\"span\",null,{\"aria-hidden\":true,\"children\":\"“\"}]]}],[\"$\",\"blockquote\",null,{\"className\":\"mt-5 text-base leading-7 text-foreground\",\"children\":\"Mudasir built a visually stunning and functional website for our institute. His design sense and execution truly exceeded our expectations.\"}],[\"$\",\"figcaption\",null,{\"className\":\"mt-auto flex items-center gap-3 pt-6\",\"children\":[[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/testmonials/wasim.webp\",\"alt\":\"\",\"width\":40,\"height\":40,\"loading\":\"lazy\",\"className\":\"size-10 border border-line object-cover\"}],[\"$\",\"span\",null,{\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-sm font-semibold\",\"children\":\"Wasim Raja\"}],[\"$\",\"span\",null,{\"className\":\"block text-xs text-muted-foreground\",\"children\":\"Founder, ACIT\"}]]}]]}]]}],[\"$\",\"figure\",\"2\",{\"className\":\"flex min-h-56 flex-col bg-card p-5 sm:p-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-4 font-mono text-[9px] uppercase tracking-[0.14em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"Note \",\"02\"]}],[\"$\",\"span\",null,{\"aria-hidden\":true,\"children\":\"“\"}]]}],[\"$\",\"blockquote\",null,{\"className\":\"mt-5 text-base leading-7 text-foreground\",\"children\":\"Mudasir created an amazing landing page and management panel for our clinic. It handles data for 100+ patients daily with ease and reliability.\"}],[\"$\",\"figcaption\",null,{\"className\":\"mt-auto flex items-center gap-3 pt-6\",\"children\":[[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/testmonials/bilal.webp\",\"alt\":\"\",\"width\":40,\"height\":40,\"loading\":\"lazy\",\"className\":\"size-10 border border-line object-cover\"}],[\"$\",\"span\",null,{\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-sm font-semibold\",\"children\":\"Bilal Dar\"}],[\"$\",\"span\",null,{\"className\":\"block text-xs text-muted-foreground\",\"children\":\"MedScan Ultrasounds\"}]]}]]}]]}],[\"$\",\"figure\",\"3\",{\"className\":\"flex min-h-56 flex-col bg-card p-5 sm:p-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-4 font-mono text-[9px] uppercase tracking-[0.14em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"children\":[\"Note \",\"03\"]}],[\"$\",\"span\",null,{\"aria-hidden\":true,\"children\":\"“\"}]]}],[\"$\",\"blockquote\",null,{\"className\":\"mt-5 text-base leading-7 text-foreground\",\"children\":\"Working with Mudasir transformed our workflow. His automation tools and subscription platforms save us hours of work every day.\"}],[\"$\",\"figcaption\",null,{\"className\":\"mt-auto flex items-center gap-3 pt-6\",\"children\":[[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/testmonials/tahir.webp\",\"alt\":\"\",\"width\":40,\"height\"
80:40,\"loading\":\"lazy\",\"className\":\"size-10 border border-line object-cover\"}],[\"$\",\"span\",null,{\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-sm font-semibold\",\"children\":\"Dr Tahir Rufayee\"}],[\"$\",\"span\",null,{\"className\":\"block text-xs text-muted-foreground\",\"children\":\"CEO, TRTS\"}]]}]]}]]}],[\"$\",\"figure\",\"4\",{\"className\":\"flex min-h-56 flex-col bg-card p-5 sm:p-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-4 font-mono text-[9px] uppercase tracking-[0.14em] text-muted-foreground\",\"children\":[\"$L59\",\"$L5a\"]}],\"$L5b\",\"$L5c\"]}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("35:[\"$\",\"$L5d\",null,{}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("39:[\"$\",\"div\",null,{\"className\":\"p-3.5 sm:p-4\",\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-[9px] uppercase tracking-[0.16em] text-muted-foreground\",\"children\":\"Status\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 inline-flex items-center gap-2 text-sm font-medium\",\"children\":[[\"$\",\"span\",null,{\"className\":\"size-1.5 bg-emerald-500\",\"aria-hidden\":true}],\"Open to work\"]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("3a:[\"$\",\"$L1b\",null,{\"href\":\"https://medscanbla.com\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"flex h-full flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"iso-frame\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"iso-frame-plate\"}],[\"$\",\"div\",null,{\"className\":\"iso-frame-media relative aspect-[16/10]\",\"children\":[[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/projects/medscanbla.webp\",\"alt\":\"MedScan Ultrasounds - project by Mudasir Fayaz\",\"fill\":true,\"sizes\":\"(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw\",\"loading\":\"lazy\",\"className\":\"object-cover\"}],[\"$\",\"span\",null,{\"className\":\"absolute top-3 left-3 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.12em]\",\"children\":\"Healthcare\"}],null]}]]}],[\"$\",\"div\",null,{\"className\":\"flex flex-1 flex-col pt-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-start justify-between gap-4\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-semibold tracking-[-0.02em] group-hover:text-theme-1\",\"children\":\"MedScan Ultrasounds\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":16,\"height\":16,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-up-right shrink-0 text-muted-foreground group-hover:text-theme-1\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M17 7l-10 10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7l9 0l0 9\"}],\"$undefined\"]}]]}],[\"$\",\"p\",null,{\"className\":\"mt-2 text-sm leading-6 text-muted-foreground\",\"children\":\"Landing page of MedScan Ultrasounds — No. 1 Ultrasound Centre in Baramulla.\"}],[\"$\",\"div\",null,{\"className\":\"mt-auto flex flex-wrap gap-1.5 pt-5\",\"children\":[[[\"$\",\"span\",\"ReactJS\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"ReactJS\"}],[\"$\",\"span\",\"NextJS\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"NextJS\"}],[\"$\",\"span\",\"Tailwind\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"Tailwind\"}],[\"$\",\"span\",\"Motion\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"Motion\"}]],[\"$\",\"span\",null,{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] text-muted-foreground\",\"children\":[\"+\",1]}]]}],[\"$\",\"span\",null,{\"className\":\"mt-5 inline-flex items-center gap-1.5 border-t border-line pt-3 text-xs font-medium\",\"children\":[\"View project \",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-up-right\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M17 7l-10 10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7l9 0l0 9\"}],\"$undefined\"]}]]}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("3b:[\"$\",\"div\",\"Web SuperKit\",{\"className\":\"border border-line\",\"children\":[\"$\",\"article\",null,{\"className\":\"group h-full bg-card p-3 sm:p-4\",\"children\":[\"$\",\"$L1b\",null,{\"href\":\"https://websuperkit.in\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"flex h-full flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"iso-frame\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"iso-frame-plate\"}],[\"$\",\"div\",null,{\"className\":\"iso-frame-media relative aspect-[16/10]\",\"children\":[[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/projects/superkit.webp\",\"alt\":\"Web SuperKit - project by Mudasir Fayaz\",\"fill\":true,\"sizes\":\"(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw\",\"loading\":\"lazy\",\"className\":\"object-cover\"}],[\"$\",\"span\",null,{\"className\":\"absolute top-3 left-3 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.12em]\",\"children\":\"Developer Tool\"}],null]}]]}],[\"$\",\"div\",null,{\"className\":\"flex flex-1 flex-col pt-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-start justify-between gap-4\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-semibold tracking-[-0.02em] group-hover:text-theme-1\",\"children\":\"Web SuperKit\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":16,\"height\":16,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-up-right shrink-0 text-muted-foreground group-hover:text-theme-1\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M17 7l-10 10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7l9 0l0 9\"}],\"$undefined\"]}]]}],[\"$\",\"p\",null,{\"className\":\"mt-2 text-sm leading-6 text-muted-foreground\",\"children\":\"Web SuperKit — 100+ developer tools in one Chrome extension. All your developer tools in one place.\"}],[\"$\",\"div\",null,{\"className\":\"mt-auto flex flex-wrap gap-1.5 pt-5\",\"children\":[[[\"$\",\"span\",\"ReactJS\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"ReactJS\"}],[\"$\",\"span\",\"NextJS\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"NextJS\"}],[\"$\",\"span\",\"Tailwind\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"Tailwind\"}],[\"$\",\"span\",\"Motion\",{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.06em] text-muted-foreground\",\"children\":\"Motion\"}]],[\"$\",\"span\",null,{\"className\":\"border border-line bg-page px-2 py-1 font-mono text-[9px] text-muted-foreground\",\"children\":[\"+\",1]}]]}],[\"$\",\"span\",null,{\"className\":\"mt-5 inline-flex items-center gap-1.5 border-t border-line pt-3 text-xs font-medium\",\"children\":[\"View project \",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-up-right\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M17 7l-10 10\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7l9 0l0 9\"}],\"$undefined\"]}]]}]]}]]}]}]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("3c:[\"$\",\"$L1b\",null,{\"href\":\"/projects\",\"className\":\"group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-sm font-medium text-foreground\",\"children\":\"All projects\"}],[\"$\",\"span\",null,{\"className\":\"inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground\",\"children\":[\"View all\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M5 12l14 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M13 18l6 -6\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M13 6l6 6\"}],\"$undefined\"]}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("3d:[\"$\",\"div\",null,{\"aria-hidden\":true,\"className\":\"hatched-divider border-t\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("3e:[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-code\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M7 8l-4 4l4 4\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17 8l4 4l-4 4\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M14 4l-4 16\"}],\"$undefined\"]}]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("3f:[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Progress Bar\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("40:[\"$\",\"$L1b\",\"notification-toast\",{\"href\":\"/components/notification-toast\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-code\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M7 8l-4 4l4 4\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17 8l4 4l-4 4\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M14 4l-4 16\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Notification Toast\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("41:[\"$\",\"$L1b\",null,{\"href\":\"/components\",\"className\":\"group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-sm font-medium text-foreground\",\"children\":\"All components\"}],[\"$\",\"span\",null,{\"className\":\"inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground\",\"children\":[\"View all\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M5 12l14 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M13 18l6 -6\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M13 6l6 6\"}],\"$undefined\"]}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("42:[\"$\",\"path\",\"svg-0\",{\"d\":\"M12 4l-8 4l8 4l8 -4l-8 -4\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("43:[\"$\",\"path\",\"svg-1\",{\"d\":\"M4 12l8 4l8 -4\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("44:[\"$\",\"path\",\"svg-2\",{\"d\":\"M4 16l8 4l8 -4\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("45:[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Shadow Generator\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("46:[\"$\",\"$L1b\",\"unit-converter\",{\"href\":\"/tools/unit-converter\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-ruler-measure\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M19.875 12c.621 0 1.125 .512 1.125 1.143v5.714c0 .631 -.504 1.143 -1.125 1.143h-15.875a1 1 0 0 1 -1 -1v-5.857c0 -.631 .504 -1.143 1.125 -1.143h15.75\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M9 12v2\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M6 12v3\"}],[\"$\",\"path\",\"svg-3\",{\"d\":\"M12 12v3\"}],[\"$\",\"path\",\"svg-4\",{\"d\":\"M18 12v3\"}],[\"$\",\"path\",\"svg-5\",{\"d\":\"M15 12v2\"}],[\"$\",\"path\",\"svg-6\",{\"d\":\"M3 3v4\"}],[\"$\",\"path\",\"svg-7\",{\"d\":\"M3 5h18\"}],[\"$\",\"path\",\"svg-8\",{\"d\":\"M21 3v4\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Unit Converter\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("47:[\"$\",\"$L1b\",\"word-counter\",{\"href\":\"/tools/word-counter\",\"className\":\"group flex items-center gap-3 bg-card px-4 py-3.5 transition-colors hover:bg-chip\",\"children\":[[\"$\",\"span\",null,{\"className\":\"theme-action inline-flex size-8 shrink-0 items-center justify-center\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-file-text\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M14 3v4a1 1 0 0 0 1 1h4\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M9 9l1 0\"}],[\"$\",\"path\",\"svg-3\",{\"d\":\"M9 13l6 0\"}],[\"$\",\"path\",\"svg-4\",{\"d\":\"M9 17l6 0\"}],\"$undefined\"]}]}],[\"$\",\"span\",null,{\"className\":\"min-w-0 truncate text-sm font-medium group-hover:text-theme-1\",\"children\":\"Word Counter\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("48:[\"$\",\"$L1b\",null,{\"href\":\"/tools\",\"className\":\"group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-sm font-medium text-foreground\",\"children\":\"All tools\"}],[\"$\",\"span\",null,{\"className\":\"inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground\",\"children\":[\"View all\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M5 12l14 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M13 18l6 -6\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M13 6l6 6\"}],\"$undefined\"]}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("49:[\"$\",\"div\",null,{\"className\":\"flex flex-1 flex-col pt-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-wrap items-center justify-between gap-3 font-mono text-[9px] uppercase tracking-[0.1em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"className\":\"flex flex-wrap items-center gap-3\",\"children\":[[\"$\",\"time\",null,{\"children\":\"01 Oct 2025\"}],[\"$\",\"span\",null,{\"className\":\"inline-flex items-center gap-1\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":12,\"height\":12,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-clock\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M12 7v5l3 3\"}],\"$undefined\"]}],1,\" min\"]}]]}],[\"$\",\"span\",null,{\"children\":[\"NOTE-\",\"02\"]}]]}],[\"$\",\"h3\",null,{\"className\":\"mt-4 text-base font-semibold leading-6 tracking-[-0.02em] group-hover:text-theme-1\",\"children\":\"Building a modern todo app with Zustand, Firebase, and Next.js\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 line-clamp-2 text-xs leading-5 text-muted-foreground\",\"children\":\"A real-time todo app with authentication, CRUD operations, and predictable global state, built with Next.js, Firebase, and Zustand.\"}],[\"$\",\"div\",null,{\"className\":\"mt-4 flex items-center gap-1.5 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"className\":\"border border-line bg-page px-2 py-1\",\"children\":\"next.js\"}],[\"$\",\"span\",null,{\"children\":[\"+\",3]}]]}],[\"$\",\"span\",null,{\"className\":\"mt-auto flex items-center gap-1.5 pt-5 text-xs font-medium\",\"children\":[\"Read note \",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-right\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M5 12l14 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M13 18l6 -6\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M13 6l6 6\"}],\"$undefined\"]}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("4a:[\"$\",\"article\",\"integrating-razorpay-payments-in-nextjs-step-by-step-guide-for-developers\",{\"className\":\"group h-full bg-card p-3 sm:p-4\",\"children\":[\"$\",\"$L1b\",null,{\"href\":\"/blog/integrating-razorpay-payments-in-nextjs-step-by-step-guide-for-developers\",\"className\":\"flex h-full flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"iso-frame\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"iso-frame-plate\"}],[\"$\",\"div\",null,{\"className\":\"iso-frame-media relative aspect-[16/9]\",\"children\":[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/blog/integrating-razorpay-payments-in-nextjs-step-by-step-guide-for-developers.webp\",\"alt\":\"\",\"fill\":true,\"sizes\":\"(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw\",\"loading\":\"lazy\",\"className\":\"object-cover\"}]}]]}],[\"$\",\"div\",null,{\"className\":\"flex flex-1 flex-col pt-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-wrap items-center justify-between gap-3 font-mono text-[9px] uppercase tracking-[0.1em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"className\":\"flex flex-wrap items-center gap-3\",\"children\":[[\"$\",\"time\",null,{\"children\":\"30 Sept 2025\"}],[\"$\",\"span\",null,{\"className\":\"inline-flex items-center gap-1\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":12,\"height\":12,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-clock\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M12 7v5l3 3\"}],\"$undefined\"]}],1,\" min\"]}]]}],[\"$\",\"span\",null,{\"children\":[\"NOTE-\",\"03\"]}]]}],[\"$\",\"h3\",null,{\"className\":\"mt-4 text-base font-semibold leading-6 tracking-[-0.02em] group-hover:text-theme-1\",\"children\":\"Integrating Razorpay payments in Next.js: a step-by-step guide\"}],[\"$\",\"p\",null,{\"className\":\"mt-2 line-clamp-2 text-xs leading-5 text-muted-foreground\",\"children\":\"Set up checkout, verify signatures on the server, and handle webhooks safely when integrating Razorpay with Next.js.\"}],[\"$\",\"div\",null,{\"className\":\"mt-4 flex items-center gap-1.5 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"className\":\"border border-line bg-page px-2 py-1\",\"children\":\"next.js\"}],[\"$\",\"span\",null,{\"children\":[\"+\",3]}]]}],[\"$\",\"span\",null,{\"className\":\"mt-auto flex items-center gap-1.5 pt-5 text-xs font-medium\",\"children\":[\"Read note \",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-right\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M5 12l14 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M13 18l6 -6\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M13 6l6 6\"}],\"$undefined\"]}]]}]]}]]}]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("4b:[\"$\",\"$L1b\",null,{\"href\":\"/blog\",\"className\":\"group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-sm font-medium text-foreground\",\"children\":\"All writing\"}],[\"$\",\"span\",null,{\"className\":\"inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground\",\"children\":[\"View all\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M5 12l14 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M13 18l6 -6\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M13 6l6 6\"}],\"$undefined\"]}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("4c:[\"$\",\"path\",\"svg-0\",{\"d\":\"M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("4d:[\"$\",\"path\",\"svg-1\",{\"d\":\"M16 3v4\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("4e:[\"$\",\"path\",\"svg-2\",{\"d\":\"M8 3v4\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("4f:[\"$\",\"path\",\"svg-3\",{\"d\":\"M4 11h16\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("50:[\"$\",\"path\",\"svg-4\",{\"d\":\"M11 15h1\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("51:[\"$\",\"path\",\"svg-5\",{\"d\":\"M12 15v3\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("52:[\"$\",\"time\",null,{\"dateTime\":\"2026-03-20\",\"children\":\"20 Mar 2026\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("53:[\"$\",\"p\",null,{\"className\":\"mt-3 text-sm leading-6 text-muted-foreground\",\"children\":\"A polyclinic website with online appointment booking and clinic management.\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("54:[\"$\",\"ul\",null,{\"className\":\"mt-4 space-y-2\",\"children\":[[\"$\",\"li\",\"Built the patient-facing website with a clear service structure\",{\"className\":\"flex gap-2.5 text-sm leading-6 text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"mt-2.5 size-1 shrink-0 bg-theme-1\"}],[\"$\",\"span\",null,{\"className\":\"min-w-0\",\"children\":\"Built the patient-facing website with a clear service structure\"}]]}],[\"$\",\"li\",\"Implemented online appointment booking and request handling\",{\"className\":\"flex gap-2.5 text-sm leading-6 text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"mt-2.5 size-1 shrink-0 bg-theme-1\"}],[\"$\",\"span\",null,{\"className\":\"min-w-0\",\"children\":\"Implemented online appointment booking and request handling\"}]]}],[\"$\",\"li\",\"Connected the frontend to a Supabase data layer for staff workflows\",{\"className\":\"flex gap-2.5 text-sm leading-6 text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"mt-2.5 size-1 shrink-0 bg-theme-1\"}],[\"$\",\"span\",null,{\"className\":\"min-w-0\",\"children\":\"Connected the frontend to a Supabase data layer for staff workflows\"}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("55:[\"$\",\"div\",null,{\"className\":\"no-scrollbar mt-4 flex items-center gap-1.5 overflow-x-auto border-t border-line pt-4\",\"children\":[[\"$\",\"span\",\"ReactJS\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"ReactJS\"}],[\"$\",\"span\",\"NextJS\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"NextJS\"}],[\"$\",\"span\",\"Tailwind\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Tailwind\"}],[\"$\",\"span\",\"Motion\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Motion\"}],[\"$\",\"span\",\"Supabase\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Supabase\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("56:[\"$\",\"li\",\"medvue-healthlabs\",{\"className\":\"relative pl-6 sm:pl-10 pb-5 sm:pb-6\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"absolute top-9 bottom-0 left-[3px] w-px bg-line\"}],[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"absolute top-[30px] left-0 size-[7px] bg-theme-1\"}],[\"$\",\"article\",null,{\"className\":\"border border-line bg-card p-4 sm:p-5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-start justify-between gap-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"min-w-0\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-semibold tracking-[-0.02em] sm:text-lg\",\"children\":[\"$\",\"a\",null,{\"href\":\"https://medvuelabs.pages.dev\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex items-center gap-1.5 hover:text-theme-1\",\"children\":[\"Medvue Healthlabs\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-external-link\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M11 13l9 -9\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M15 4h5v5\"}],\"$undefined\"]}]]}]}],[\"$\",\"p\",null,{\"className\":\"mt-1.5 inline-flex items-center gap-1.5 font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":13,\"height\":13,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-map-pin\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M9 11a3 3 0 1 0 6 0a3 3 0 0 0 -6 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17.657 16.657l-4.243 4.243a2 2 0 0 1 -2.827 0l-4.244 -4.243a8 8 0 1 1 11.314 0\"}],\"$undefined\"]}],\"Remote\"]}]]}],[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"flex size-11 shrink-0 items-center justify-center border border-line bg-chip font-mono text-xs font-semibold text-foreground sm:size-12\",\"children\":\"MH\"}]]}],[\"$\",\"div\",null,{\"className\":\"mt-4 flex flex-wrap items-center gap-x-3 gap-y-2\",\"children\":[[\"$\",\"span\",null,{\"className\":\"border border-line bg-chip px-2 py-0.5 font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground\",\"children\":\"Freelance\"}],[\"$\",\"p\",null,{\"className\":\"inline-flex items-center gap-2 text-sm font-medium\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-briefcase shrink-0 text-theme-1\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3 9a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v9a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2l0 -9\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7v-2a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v2\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M12 12l0 .01\"}],[\"$\",\"path\",\"svg-3\",{\"d\":\"M3 13a20 20 0 0 0 18 0\"}],\"$undefined\"]}],\"Frontend Engineer\"]}]]}],[\"$\",\"p\",null,{\"className\":\"mt-2 inline-flex items-center gap-2 font-mono text-xs text-muted-foreground\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":13,\"height\":13,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-calendar\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M16 3v4\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M8 3v4\"}],[\"$\",\"path\",\"svg-3\",{\"d\":\"M4 11h16\"}],[\"$\",\"path\",\"svg-4\",{\"d\":\"M11 15h1\"}],[\"$\",\"path\",\"svg-5\",{\"d\":\"M12 15v3\"}],\"$undefined\"]}],[\"$\",\"time\",null,{\"dateTime\":\"2025-09-02\",\"children\":\"2 Sept 2025\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-sm leading-6 text-muted-foreground\",\"children\":\"A healthlab landing page with online lab-test booking.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 space-y-2\",\"children\":[[\"$\",\"li\",\"Built the landing page and test catalogue layout\",{\"className\":\"flex gap-2.5 text-sm leading-6 text-muted-foreground\",\"children\":[\"$L5e\",\"$L5f\"]}],\"$L60\",\"$L61\"]}],\"$L62\"]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("57:[\"$\",\"li\",\"trts\",{\"className\":\"relative pl-6 sm:pl-10 \",\"children\":[null,[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"absolute top-[30px] left-0 size-[7px] bg-theme-1\"}],[\"$\",\"article\",null,{\"className\":\"border border-line bg-card p-4 sm:p-5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-start justify-between gap-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"min-w-0\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-semibold tracking-[-0.02em] sm:text-lg\",\"children\":\"TRTS\"}],[\"$\",\"p\",null,{\"className\":\"mt-1.5 inline-flex items-center gap-1.5 font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":13,\"height\":13,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-map-pin\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M9 11a3 3 0 1 0 6 0a3 3 0 0 0 -6 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M17.657 16.657l-4.243 4.243a2 2 0 0 1 -2.827 0l-4.244 -4.243a8 8 0 1 1 11.314 0\"}],\"$undefined\"]}],\"Kashmir, India\"]}]]}],[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"flex size-11 shrink-0 items-center justify-center border border-line bg-chip font-mono text-xs font-semibold text-foreground sm:size-12\",\"children\":\"TR\"}]]}],[\"$\",\"div\",null,{\"className\":\"mt-4 flex flex-wrap items-center gap-x-3 gap-y-2\",\"children\":[[\"$\",\"span\",null,{\"className\":\"border border-line bg-chip px-2 py-0.5 font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground\",\"children\":\"Full-time\"}],[\"$\",\"p\",null,{\"className\":\"inline-flex items-center gap-2 text-sm font-medium\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":15,\"height\":15,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-briefcase shrink-0 text-theme-1\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M3 9a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v9a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2l0 -9\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M8 7v-2a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v2\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M12 12l0 .01\"}],[\"$\",\"path\",\"svg-3\",{\"d\":\"M3 13a20 20 0 0 0 18 0\"}],\"$undefined\"]}],\"Senior Developer\"]}]]}],[\"$\",\"p\",null,{\"className\":\"mt-2 inline-flex items-center gap-2 font-mono text-xs text-muted-foreground\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":13,\"height\":13,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-calendar\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M16 3v4\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M8 3v4\"}],[\"$\",\"path\",\"svg-3\",{\"d\":\"M4 11h16\"}],[\"$\",\"path\",\"svg-4\",{\"d\":\"M11 15h1\"}],[\"$\",\"path\",\"svg-5\",{\"d\":\"M12 15v3\"}],\"$undefined\"]}],[\"$\",\"time\",null,{\"dateTime\":\"2025-05-16\",\"children\":\"16 May 2025\"}]]}],[\"$\",\"p\",null,{\"className\":\"mt-3 text-sm leading-6 text-muted-foreground\",\"children\":\"Senior developer role building and maintaining frontend products for the company.\"}],[\"$\",\"ul\",null,{\"className\":\"mt-4 space-y-2\",\"children\":[[\"$\",\"li\",\"Lead frontend development across the company's web products\",{\"className\":\"flex gap-2.5 text-sm leading-6 text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"mt-2.5 size-1 shrink-0 bg-theme-1\"}],[\"$\",\"span\",null,{\"className\":\"min-w-0\",\"children\":\"Lead frontend development across the company's web products\"}]]}],[\"$\",\"li\",\"Build and maintain reusable interface systems and components\",{\"className\":\"flex gap-2.5 text-sm leading-6 text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"mt-2.5 size-1 shrink-0 bg-theme-1\"}],[\"$\",\"span\",null,{\"className\":\"min-w-0\",\"children\":\"Build and maintain reusable interface systems and components\"}]]}],[\"$\",\"li\",\"Review work and raise the bar on performance and accessibility\",{\"className\":\"flex gap-2.5 text-sm leading-6 text-muted-foreground\",\"children\":[\"$L63\",\"$L64\"]}]]}],\"$L65\"]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("58:[\"$\",\"$L1b\",null,{\"href\":\"/experience\",\"className\":\"group flex items-center justify-between gap-4 border-t border-line px-4 py-4 transition-colors hover:bg-chip sm:px-7\",\"children\":[[\"$\",\"span\",null,{\"className\":\"text-sm font-medium text-foreground\",\"children\":\"Full timeline\"}],[\"$\",\"span\",null,{\"className\":\"inline-flex items-center gap-2 font-mono text-[10px] uppercase tracking-[0.14em] text-muted-foreground\",\"children\":[\"View all\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":14,\"height\":14,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"tabler-icon tabler-icon-arrow-right transition-transform group-hover:translate-x-0.5\",\"aria-hidden\":true,\"children\":[\"$undefined\",[\"$\",\"path\",\"svg-0\",{\"d\":\"M5 12l14 0\"}],[\"$\",\"path\",\"svg-1\",{\"d\":\"M13 18l6 -6\"}],[\"$\",\"path\",\"svg-2\",{\"d\":\"M13 6l6 6\"}],\"$undefined\"]}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("59:[\"$\",\"span\",null,{\"children\":[\"Note \",\"04\"]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("5a:[\"$\",\"span\",null,{\"aria-hidden\":true,\"children\":\"“\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("5b:[\"$\",\"blockquote\",null,{\"className\":\"mt-5 text-base leading-7 text-foreground\",\"children\":\"Mudasir's landing page designs are modern, responsive, and beautifully interactive. He's consistently delivered outstanding websites for my clients.\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("5c:[\"$\",\"figcaption\",null,{\"className\":\"mt-auto flex items-center gap-3 pt-6\",\"children\":[[\"$\",\"$L38\",null,{\"src\":\"/thumbnails/testmonials/naveed.webp\",\"alt\":\"\",\"width\":40,\"height\":40,\"loading\":\"lazy\",\"className\":\"size-10 border border-line object-cover\"}],[\"$\",\"span\",null,{\"children\":[[\"$\",\"strong\",null,{\"className\":\"block text-sm font-semibold\",\"children\":\"Naveed Khan\"}],[\"$\",\"span\",null,{\"className\":\"block text-xs text-muted-foreground\",\"children\":\"Founder, Fubll Softwares\"}]]}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("5e:[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"mt-2.5 size-1 shrink-0 bg-theme-1\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("5f:[\"$\",\"span\",null,{\"className\":\"min-w-0\",\"children\":\"Built the landing page and test catalogue layout\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("60:[\"$\",\"li\",\"Implemented the online lab-test booking entry points\",{\"className\":\"flex gap-2.5 text-sm leading-6 text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"mt-2.5 size-1 shrink-0 bg-theme-1\"}],[\"$\",\"span\",null,{\"className\":\"min-w-0\",\"children\":\"Implemented the online lab-test booking entry points\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("61:[\"$\",\"li\",\"Tuned the page for fast first load and mobile visitors\",{\"className\":\"flex gap-2.5 text-sm leading-6 text-muted-foreground\",\"children\":[[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"mt-2.5 size-1 shrink-0 bg-theme-1\"}],[\"$\",\"span\",null,{\"className\":\"min-w-0\",\"children\":\"Tuned the page for fast first load and mobile visitors\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("62:[\"$\",\"div\",null,{\"className\":\"no-scrollbar mt-4 flex items-center gap-1.5 overflow-x-auto border-t border-line pt-4\",\"children\":[[\"$\",\"span\",\"ReactJS\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"ReactJS\"}],[\"$\",\"span\",\"NextJS\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"NextJS\"}],[\"$\",\"span\",\"Tailwind\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Tailwind\"}],[\"$\",\"span\",\"Motion\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Motion\"}]]}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("63:[\"$\",\"span\",null,{\"aria-hidden\":true,\"className\":\"mt-2.5 size-1 shrink-0 bg-theme-1\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("64:[\"$\",\"span\",null,{\"className\":\"min-w-0\",\"children\":\"Review work and raise the bar on performance and accessibility\"}]\n")</script>
80<script>((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).rsc.push("65:[\"$\",\"div\",null,{\"className\":\"no-scrollbar mt-4 flex items-center gap-1.5 overflow-x-auto border-t border-line pt-4\",\"children\":[[\"$\",\"span\",\"ReactJS\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"ReactJS\"}],[\"$\",\"span\",\"NextJS\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"NextJS\"}],[\"$\",\"span\",\"Tailwind\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Tailwind\"}],[\"$\",\"span\",\"Motion\",{\"className\":\"shrink-0 border border-line bg-page px-2 py-1 font-mono text-[9px] uppercase tracking-[0.08em] text-muted-foreground\",\"children\":\"Motion\"}]]}]\n")</script>
80<script>Object.assign(((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}),{"initialCacheKind":"static"});((self[Symbol.for("vinext.navigationRuntime")]??={bootstrap:{routeManifest:null},functions:{}}).bootstrap.rsc??={rsc:[]}).done=true</script>
80<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"bfe5bfae49024eca89f984d60d09486b","r":1,"spa":2}' crossorigin="anonymous"></script>
vendor: 1 bytes, line 80
80
81<script>(function(){function c(){var b=a.contentDocument||(a.contentWindow&&a.contentWindow.document);if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'a402542c3921ac3c',t:'MTc5MDI1ODU2Nw=='};var a=document.createElement('script');a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script>
81</body></html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.