1<!DOCTYPE html><html data-dpl-id="dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" as="image" href="/images/demo-avatar/avatar-1.png"/><link rel="preload" as="image" href="/images/demo-avatar/avatar-2.png"/><link rel="preload" as="image" href="/images/demo-avatar/avatar-3.png"/><link rel="preload" as="image" href="/images/demo-avatar/avatar-4.png"/><link rel="stylesheet" href="/_next/static/chunks/0nip9_xlnfah2.css?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" data-precedence="next"/><link rel="stylesheet" href="/_next/static/chunks/01rl.d.5n-_.t.css?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/0m97bbjp.vgzu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/>
1<script src="/_next/static/chunks/128aahewwf1we.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0jlz58o7s.i_k.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0rwwge57xnfls.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0sab1fpe0x7.w.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0k6c9i47ki3cm.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0h-x-meto31k_.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/turbopack-06-kviqwqoc-q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" async=""></script>
1<script src="https://accounts.google.com/gsi/client" async="" defer=""></script>
1<link rel="preload" href="https://cdn.paddle.com/paddle/paddle.js" as="script"/><link rel="preload" href="https://www.googletagmanager.com/gtm.js?id=GTM-KGQFQXFN" as="script"/><meta name="next-size-adjust" content=""/><title>Tailgrids UI â Tailwind React Component Library and Design System</title><meta name="description" content="Tailgrids UI is an open-source React component library built with Tailwind CSS. Build production-ready apps faster with reusable components, UI blocks, templates, CLI tooling, theming, and a Figma design system."/><link rel="canonical" href="https://tailgrids.com"/><meta property="og:title" content="Tailgrids UI â Tailwind React Component Library and Design System - Tailgrids UI"/><meta property="og:description" content="Tailgrids UI is an open-source React component library built with Tailwind CSS. Build production-ready apps faster with reusable components, UI blocks, templates, CLI tooling, theming, and a Figma design system."/><meta property="og:url" content="https://tailgrids.com"/><meta property="og:image" content="https://tailgrids.com/tailgrids-og.png"/><meta property="og:type" content="website"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="Tailgrids UI â Tailwind React Component Library and Design System - Tailgrids UI"/><meta name="twitter:description" content="Tailgrids UI is an open-source React component library built with Tailwind CSS. Build production-ready apps faster with reusable components, UI blocks, templates, CLI tooling, theming, and a Figma design system."/><meta name="twitter:image" content="https://tailgrids.com/tailgrids-og.png"/><link rel="icon" href="/favicon.ico?favicon.0bt5x~xl6dod1.ico" sizes="80x80" type="image/x-icon"/>
1<script src="/_next/static/chunks/03~yq9q893hmn.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" noModule=""></script>
1</head><body class="dm_sans_9fb5127e-module__yy698a__variable geist_mono_a675bca4-module__Lt_QGq__variable relative overflow-x-hidden antialiased"><div hidden=""><!--$--><!--/$--></div><section aria-label="Notifications alt+T" tabindex="-1" aria-live="polite" aria-relevant="additions text" aria-atomic="false"></section><style>#nprogress{pointer-events:none}#nprogress .bar{background:#fff;position:fixed;z-index:9999999;top: 0;left:0;width:100%;height:3px}#nprogress .peg{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:none;opacity:1;-webkit-transform:rotate(3deg) translate(0px,-4px);-ms-transform:rotate(3deg) translate(0px,-4px);transform:rotate(3deg) translate(0px,-4px)}#nprogress .spinner{display:block;position:fixed;z-index:9999999;top: 15px;right:15px}#nprogress .spinner-icon{width:18px;height:18px;box-sizing:border-box;border:2px solid transparent;border-top-color:#fff;border-left-color:#fff;border-radius:50%;-webkit-animation:nprogress-spinner 400ms linear infinite;animation:nprogress-spinner 400ms linear infinite}.nprogress-custom-parent{overflow:hidden;position:relative}.nprogress-custom-parent #nprogress .bar,.nprogress-custom-parent #nprogress .spinner{position:absolute}@-webkit-keyframes nprogress-spinner{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes nprogress-spinner{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}</style><div class="isolate flex min-h-svh flex-col"><div class="sticky inset-x-0 top-0 z-99999 border-b border-tg-border-1 bg-white"><div class="relative mx-auto w-full max-w-[1454px]"><div class="absolute bg-(--pattern-fg) top-0 left-0 w-px [--pattern-fg:var(--border-1)] h-full"></div><div class="absolute bg-(--pattern-fg) top-0 right-0 w-px [--pattern-fg:var(--border-1)] h-full"></div><header class="px-6 py-4 lg:px-8 xl:py-1"><div class="flex items-center justify-between"><div class="flex items-center gap-3"><a class="shrink-0" href="/"><img alt="Logo" loading="lazy" width="142" height="42" decoding="async" data-nimg="1" style="color:transparent" src="/images/tailgrids-full-logo.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></a><div class="relative"><button class="flex h-6 cursor-pointer items-center gap-1 rounded-lg border border-[#EDEDED] bg-[#F3F4F6] px-2 py-1 text-xs font-medium text-gray-700 transition duration-200 hover:bg-gray-200">v3.0<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="size-3.5 shrink-0 duration-200"><path d="M5.75 8.875L12 15.125L18.25 8.875" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="absolute top-full left-0 z-50 mt-2 min-w-20 rounded-xl border border-tg-border-1 bg-white p-1 shadow-lg transition-all duration-200 invisible opacity-0"><a class="block rounded-lg px-3 py-1.5 text-xs font-medium text-tg-text-color duration-200 hover:bg-gray-100 hover:text-tg-title-color" href="/">v3.0</a><a target="_blank" href="https://tailgrids.com/docs/changelog#current-version-230" class="block rounded-lg px-3 py-1.5 text-xs font-medium text-tg-text-color duration-200 hover:bg-gray-100 hover:text-tg-title-color">v2.3</a> <a target="_blank" href="https://tailgrids.com/docs/changelog#version-110" class="block rounded-lg px-3 py-1.5 text-xs font-medium text-tg-text-color duration-200 hover:bg-gray-100 hover:text-tg-title-color">v1.1</a></div></div><nav class="ml-4 hidden xl:ml-6 xl:block 2xl:ml-8"><ul class="flex items-center gap-2"><li class="group relative inline-flex py-5.5"><a target="_self" class="inline-flex items-center gap-0.5 rounded-lg px-2 py-1.5 text-sm font-medium text-tg-text-color duration-200 hover:bg-gray-100 hover:text-tg-title-color" href="/docs/components">Components</a></li><li class="group relative inline-flex py-5.5"><a target="_self" class="inline-flex items-center gap-0.5 rounded-lg px-2 py-1.5 text-sm font-medium text-tg-text-color duration-200 hover:bg-gray-100 hover:text-tg-title-color" href="/blocks">Blocks</a></li><li class="group relative inline-flex py-5.5"><a target="_self" class="inline-flex items-center gap-0.5 rounded-lg px-2 py-1.5 text-sm font-medium text-tg-text-color duration-200 hover:bg-gray-100 hover:text-tg-title-color" href="/templates">Templates</a></li><li class="group relative inline-flex py-5.5"><a target="_self" class="inline-flex items-center gap-0.5 rounded-lg px-2 py-1.5 text-sm font-medium text-tg-text-color duration-200 hover:bg-gray-100 hover:text-tg-title-color" href="/figma">Figma</a></li><li class="group relative inline-flex py-5.5"><a target="_self" class="inline-flex items-center gap-0.5 rounded-lg px-2 py-1.5 text-sm font-medium text-tg-text-color duration-200 hover:bg-gray-100 hover:text-tg-title-color" href="/docs">Docs</a></li><li class="group relative inline-flex py-5.5"><button class="inline-flex cursor-pointer items-center gap-0.5 rounded-lg px-2 py-1.5 text-sm font-medium text-tg-text-color duration-200 hover:bg-gray-100 hover:text-tg-title-color">
1Resources<span class="duration-200"><svg class="size-3.5" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.35352 5.17676L6.99935 8.82259L10.6452 5.17676" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"></path></svg></span></button><div class="relative top-full left-0 grid gap-4 rounded-20 border-tg-border-1 bg-white transition-all duration-200 max-lg:py-3 lg:absolute lg:w-[370px] lg:border lg:p-2 lg:shadow-lg lg:invisible lg:opacity-0"><div><a class="flex gap-3 rounded-[14px] p-4 duration-200 hover:bg-gray-100" href="https://pimjo.com/community"><div class="text-tg-text-color-tertiary"><svg class="size-6" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.7583 10.8066C14.8259 10.4498 14.86 10.0832 14.8606 9.70674C14.8628 8.29058 14.3508 6.92179 13.4197 5.85474M3.42021 7.87263C3.69579 7.03638 4.15586 6.27279 4.76637 5.63833C5.37688 5.00388 6.12223 4.51479 6.94726 4.20726M10.0944 15.4696C9.73198 15.5393 9.36361 15.5736 8.99453 15.5719C7.66027 15.5738 6.36552 15.1191 5.32537 14.2835M9.00021 6.15789C9.51843 6.15789 10.0154 5.95203 10.3819 5.5856C10.7483 5.21916 10.9542 4.72217 10.9542 4.20395C10.9542 3.68573 10.7483 3.18873 10.3819 2.8223C10.0154 2.45586 9.51843 2.25 9.00021 2.25C8.48199 2.25 7.985 2.45586 7.61856 2.8223C7.25212 3.18873 7.04626 3.68573 7.04626 4.20395C7.04626 4.72217 7.25212 5.21916 7.61856 5.5856C7.985 5.95203 8.48199 6.15789 9.00021 6.15789ZM3.1 11.0387C3.32219 10.9105 3.56748 10.8272 3.82185 10.7938C4.07622 10.7603 4.33469 10.7772 4.5825 10.8437C4.83032 10.9101 5.06262 11.0247 5.26616 11.1808C5.46969 11.337 5.64047 11.5318 5.76874 11.754C5.897 11.9762 5.98025 12.2215 6.01372 12.4759C6.04719 12.7302 6.03024 12.9887 5.96382 13.2365C5.8974 13.4843 5.78282 13.7166 5.62662 13.9202C5.47043 14.1237 5.27567 14.2945 5.05347 14.4227C4.60473 14.6818 4.07145 14.752 3.57097 14.6178C3.07048 14.4837 2.64378 14.1562 2.38474 13.7075C2.12569 13.2587 2.05552 12.7255 2.18965 12.225C2.32379 11.7245 2.65125 11.2978 3.1 11.0387ZM12.9413 14.4218C12.7191 14.2935 12.5244 14.1226 12.3683 13.9191C12.2122 13.7155 12.0977 13.4832 12.0314 13.2354C11.9651 12.9875 11.9482 12.7291 11.9817 12.4748C12.0153 12.2204 12.0986 11.9752 12.2269 11.7531C12.3553 11.5309 12.5261 11.3362 12.7297 11.1801C12.9332 11.024 13.1656 10.9095 13.4134 10.8432C13.6612 10.7769 13.9196 10.76 14.174 10.7935C14.4283 10.8271 14.6735 10.9104 14.8957 11.0387C15.3443 11.2979 15.6716 11.7247 15.8056 12.2252C15.9395 12.7257 15.8692 13.2589 15.61 13.7075C15.3508 14.1561 14.9241 14.4834 14.4236 14.6173C13.9231 14.7513 13.3899 14.681 12.9413 14.4218Z" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"></path></svg></div><div><span class="mb-1 block text-base font-medium -tracking-[.2px] text-tg-title-color">Community</span><span class="block text-sm -tracking-[.2px] text-tg-text-color-secondary">Connect, share, and grow with fellow users.</span></div></a><a class="flex gap-3 rounded-[14px] p-4 duration-200 hover:bg-gray-100" href="/support"><div class="text-tg-text-color-tertiary"><svg class="size-6" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g filter="url(#filter0_i_13801_23632)"><path d="M16.9983 14.1426H18.9057C19.9571 14.1426 20.8097 13.29 20.8097 12.2374V6.04772C20.8097 4.99629 19.9571 4.14258 18.9057 4.14258H9.14341C8.09198 4.14258 7.23826 4.99515 7.23826 6.04772V7.95172M15.0954 7.95172H5.09541C4.04398 7.95172 3.19141 8.80544 3.19141 9.85686V16.0477C3.19141 17.0991 4.04398 17.9517 5.09541 17.9517H6.28626V20.3334L10.572 17.9517H15.0954C16.1468 17.9517 17.0005 17.0991 17.0005 16.0477V9.85686C17.0005 8.80544 16.148 7.95172 15.0954 7.95172Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></g><defs><filter id="filter0_i_13801_23632" x="2.44141" y="3.39258" width="19.1191" height="18.1904" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
1<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="0.5"></feOffset><feGaussianBlur stdDeviation="0.25"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix type="matrix" values="0 0 0 0 0.121569 0 0 0 0 0.160784 0 0 0 0 0.215686 0 0 0 0.2 0"></feColorMatrix><feBlend mode="normal" in2="shape" result="effect1_innerShadow_13801_23632"></feBlend></filter></defs></svg></div><div><span class="mb-1 block text-base font-medium -tracking-[.2px] text-tg-title-color">Support</span><span class="block text-sm -tracking-[.2px] text-tg-text-color-secondary">Need help? Our teamâs here for you.</span></div></a><a class="flex gap-3 rounded-[14px] p-4 duration-200 hover:bg-gray-100" href="/roadmap"><div class="text-tg-text-color-tertiary"><svg class="size-6" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g filter="url(#filter0_i_13731_42470)"><path d="M11.9983 16.2504V20.25M11.9983 16.2504H6.03432C5.38512 16.2504 4.77432 15.9348 4.40112 15.4032L2.81232 13.1532C2.57476 12.8156 2.44727 12.4128 2.44727 12C2.44727 11.5872 2.57476 11.1844 2.81232 10.8468L4.40112 8.5968C4.77552 8.0652 5.38512 7.7496 6.03432 7.7496H10.9987C11.5507 7.7496 11.9983 8.1972 11.9983 8.7504V16.2504ZM12.9979 3.75H17.9623C18.6115 3.75 19.2211 4.0656 19.5955 4.5972L21.1843 6.8472C21.4219 7.18482 21.5494 7.58758 21.5494 8.0004C21.5494 8.41322 21.4219 8.81598 21.1843 9.1536L19.5955 11.4036C19.2211 11.934 18.6115 12.2496 17.9623 12.2496H12.9979C12.733 12.2493 12.4791 12.1438 12.2919 11.9564C12.1047 11.769 11.9995 11.5149 11.9995 11.25V4.7496C11.9995 4.1976 12.4459 3.75 12.9979 3.75Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></g><defs><filter id="filter0_i_13731_42470" x="1.69727" y="3" width="20.6016" height="18.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="0.5"></feOffset><feGaussianBlur stdDeviation="0.25"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix type="matrix" values="0 0 0 0 0.121569 0 0 0 0 0.160784 0 0 0 0 0.215686 0 0 0 0.2 0"></feColorMatrix><feBlend mode="normal" in2="shape" result="effect1_innerShadow_13731_42470"></feBlend></filter></defs></svg></div><div><span class="mb-1 block text-base font-medium -tracking-[.2px] text-tg-title-color">Roadmap</span><span class="block text-sm -tracking-[.2px] text-tg-text-color-secondary">Discover upcoming features and releases.</span></div></a><a class="flex gap-3 rounded-[14px] p-4 duration-200 hover:bg-gray-100" href="/icons"><div class="text-tg-text-color-tertiary"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="size-6"><g filter="url(#filter0_i_15047_20889)"><path d="M7.496 7.557a.925.925 0 00-.88-.245.918.918 0 00-.671.626l-3.9 12.143a.928.928 0 001.17 1.17l12.152-3.9a.952.952 0 00.626-.67.925.925 0 00-.245-.88L7.496 7.557zM4.376 18.93L7.251 9.96l6.094 6.095-8.969 2.874z" fill="currentColor"></path></g><g filter="url(#filter1_i_15047_20889)"><path d="M12.501 9.57a.937.937 0 00.925.817c.407 0 .822-.093 1.225-.145a2.358 2.358 0 002.05-2.34v-.29a.495.495 0 01.49-.49h1.54a.933.933 0 00.935-.934.933.933 0 00-.934-.934H17.19a2.354 2.354 0 00-2.349 2.358v.29a.481.481 0 01-.426.48l-1.
1106.146A.937.937 0 0012.5 9.57z" fill="currentColor"></path></g><g filter="url(#filter2_i_15047_20889)"><path d="M21.634 10.876c-2.358-1.804-4.906-.208-5.93.89a.931.931 0 00.044 1.314.93.93 0 001.316-.036c.072-.082 1.84-1.914 3.436-.69a.927.927 0 001.306-.172.927.927 0 00-.172-1.306z" fill="currentColor"></path></g><g filter="url(#filter3_i_15047_20889)"><path d="M11.421 7.612c1.043-.798 2.095-2.666.726-4.525a.93.93 0 00-1.306-.2.93.93 0 00-.2 1.306c.717.97-.1 1.741-.362 1.95a.936.936 0 00-.173 1.306c.32.415.906.465 1.315.163z" fill="currentColor"></path></g><defs><filter id="filter0_i_15047_20889" x="2" y="7.28418" width="14.0215" height="14.5117" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="0.5"></feOffset><feGaussianBlur stdDeviation="0.25"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0.121569 0 0 0 0 0.160784 0 0 0 0 0.215686 0 0 0 0.2 0"></feColorMatrix><feBlend in2="shape" result="effect1_innerShadow_15047_20889"></feBlend></filter><filter id="filter1_i_15047_20889" x="12.4941" y="5.25391" width="7.17188" height="5.63281" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="0.5"></feOffset><feGaussianBlur stdDeviation="0.25"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0.121569 0 0 0 0 0.160784 0 0 0 0 0.215686 0 0 0 0.2 0"></feColorMatrix><feBlend in2="shape" result="effect1_innerShadow_15047_20889"></feBlend></filter><filter id="filter2_i_15047_20889" x="15.4531" y="10.0605" width="6.54688" height="3.77344" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="0.5"></feOffset><feGaussianBlur stdDeviation="0.25"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0.121569 0 0 0 0 0.160784 0 0 0 0 0.215686 0 0 0 0.2 0"></feColorMatrix><feBlend in2="shape" result="effect1_innerShadow_15047_20889"></feBlend></filter><filter id="filter3_i_15047_20889" x="9.91602" y="2.7041" width="2.88281" height="5.60059" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="0.5"></feOffset><feGaussianBlur stdDeviation="0.25"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix values="0 0 0 0 0.121569 0 0 0 0 0.160784 0 0 0 0 0.215686 0 0 0 0.2 0"></feColorMatrix><feBlend in2="shape" result="effect1_innerShadow_15047_20889"></feBlend></filter></defs></svg></div><div><span class="mb-1 block text-base font-medium -tracking-[.2px] text-tg-title-color">Icons</span><span class="block text-sm -tracking-[.2px] text-tg-text-color-secondary">Get started with our tailgrids free icons</span></div></a><a class="flex gap-3 rounded-[14px] p-4 duration-200 hover:bg-gray-100" href="/blog"><div class="text-tg-text-color-tertiary"><svg class="size-6" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
1<g filter="url(#filter0_i_13731_42473)"><path d="M1.74805 5.75089H9.24805M1.74805 9.75049H6.24805M21.3344 6.97369L20.024 5.66569C19.6489 5.29072 19.1402 5.08008 18.6098 5.08008C18.0795 5.08008 17.5708 5.29072 17.1956 5.66569L8.33365 14.5265C7.95887 14.902 7.74828 15.4108 7.74805 15.9413V19.2509H11.0576C11.588 19.2509 12.0968 19.0397 12.4712 18.6641L21.3344 9.80209C22.1144 9.02209 22.1144 7.75489 21.3344 6.97369Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></g><defs><filter id="filter0_i_13731_42473" x="0.998047" y="4.33008" width="21.6719" height="16.1709" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="0.5"></feOffset><feGaussianBlur stdDeviation="0.25"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix type="matrix" values="0 0 0 0 0.121569 0 0 0 0 0.160784 0 0 0 0 0.215686 0 0 0 0.2 0"></feColorMatrix><feBlend mode="normal" in2="shape" result="effect1_innerShadow_13731_42473"></feBlend></filter></defs></svg></div><div><span class="mb-1 block text-base font-medium -tracking-[.2px] text-tg-title-color">Blog</span><span class="block text-sm -tracking-[.2px] text-tg-text-color-secondary">Fresh news and product updates.</span></div></a><a class="flex gap-3 rounded-[14px] p-4 duration-200 hover:bg-gray-100" href="https://tailgrids.com/docs/mcp"><div class="text-tg-text-color-tertiary"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="size-6"><g clip-path="url(#clip0_16479_41488)"><mask id="mask0_16479_41488" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><path d="M24 0H0V24H24V0Z" fill="white"></path></mask><g mask="url(#mask0_16479_41488)"><g filter="url(#filter0_i_16479_41488)"><path d="M2.40039 11.3144L11.4514 2.26343C12.701 1.01375 14.7272 1.01375 15.9768 2.26343C17.2265 3.5131 17.2265 5.53923 15.9768 6.78891M15.9768 6.78891L9.14147 13.6243M15.9768 6.78891L9.23581 13.5301M15.9768 6.78891C17.2265 5.53923 19.2527 5.53927 20.5024 6.78895L20.5495 6.83609C21.7992 8.08577 21.7992 10.1119 20.5495 11.3616L12.3638 19.5474C11.9472 19.9639 11.9472 20.6393 12.3638 21.0558L14.0446 22.7367M13.7142 4.52617L7.0202 11.2201C5.77052 12.4698 5.77052 14.4959 7.0202 15.7456C8.26988 16.9952 10.296 16.9952 11.5457 15.7456L18.2396 9.05165" stroke="#9CA3AF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></g></g></g><defs><filter id="filter0_i_16479_41488" x="1.65039" y="0.576172" width="20.5859" height="23.4102" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="0.5"></feOffset><feGaussianBlur stdDeviation="0.25"></feGaussianBlur><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix type="matrix" values="0 0 0 0 0.121569 0 0 0 0 0.160784 0 0 0 0 0.215686 0 0 0 0.2 0"></feColorMatrix><feBlend mode="normal" in2="shape" result="effect1_innerShadow_16479_41488"></feBlend></filter><clipPath id="clip0_16479_41488"><rect width="24" height="24" fill="white"></rect></clipPath></defs></svg></div><div><span class="mb-1 block text-base font-medium -tracking-[.2px] text-tg-title-color">Tailgrids MCP</span><span class="block text-sm -tracking-[.2px] text-tg-text-color-secondary">Generate modern UI instantly with AI</span></div></a></div></div></li></ul></nav></div><div class="flex items-center justify-end lg:justify-between"><div class="flex shrink-0 items-center gap-x-4 max-lg:hidden 2xl:gap-x-6"><button class="group flex items-center gap-3 overflow-hidden rounded-xl border border-gray-200 bg-white px-2.5 transition-colors hover:bg-gray-50 max-2xl:py-1 max-2xl:pr-1.5 max-2xl:pl-2 max-xl:aspect-square max-xl:justify-center md:h-10.5 xl:pl-4 2xl:h-11 2xl:w-60" aria-label="Open search"><svg class="size-5 text-tg-text-color-tertiary" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.4375 2.3125C13.3726 2.3125 16.5634 5.5019 16.5635 9.43652C16.5635 11.1342 15.9681 12.6921 14.9766 13.916L17.4688 16.4082C17.7609 16.7011 17.7604 17.1761 17.4678 17.4688C17.175 17.7612 16.7 17.7612 16.4072 17.4688L13.915 14.9756C12.6911 15.9656 11.1343 16.5605 9.4375 16.5605C5.50258 16.5603 2.3125 13.3711 2.3125 9.43652C2.31258 5.50205 5.50263 2.31273 9.4375 2.3125ZM9.4375 3.8125C6.33077 3.81273 3.81258 6.33076 3.8125 9.43652C3.8125 12.5424 6.33072 15.0603 9.4375 15.0605C12.5445 15.0605 15.0635 12.5425 15.0635 9.43652C15.0634 6.33062 12.5444 3.8125 9.4375 3.8125Z" fill="currentColor"></path></svg><span class="pointer-events-none text-sm text-tg-text-color-tertiary max-xl:hidden 2xl:hidden">Search</span><span class="pointer-events-none flex h-full flex-1 items-center text-sm text-tg-text-color-tertiary max-2xl:hidden">Quick search...</span><span class="pointer-events-none flex h-6.5 w-10 items-center justify-center rounded-lg border border-gray-100 text-xs text-tg-text-color-secondary group-hover:bg-white max-xl:hidden">â K</span></button><div class="max-xl:hidden"><div class="flex items-center justify-start gap-2"><a target="_blank" rel="noopener noreferrer" aria-label="X" class="flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none size-8" href="https://x.com/tailgrids"><span class="shrink-0">
1<svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.0532 2.625H15.2132L10.4922 8.025L16.0472 15.375H11.6972L8.29117 10.918L4.39217 15.375H2.23017L7.28017 9.598L1.95117 2.625H6.41117L9.49117 6.699L13.0532 2.625ZM12.2932 14.08H13.4922L5.76017 3.852H4.47617L12.2952 14.08H12.2932Z" fill="currentColor"></path></svg></span></a><a target="_blank" rel="noopener noreferrer" aria-label="Github" class="flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none h-8 w-[63px] gap-1.5" href="https://github.com/Tailgrids/tailgrids"><span class="shrink-0"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 1.46289C13.144 1.46289 16.5 4.81889 16.5 8.96289C16.5 10.5345 16.0068 12.0666 15.0901 13.3432C14.1734 14.6198 12.8792 15.5766 11.39 16.0789C11.016 16.1539 10.875 15.9189 10.875 15.7219C10.875 15.4689 10.885 14.6629 10.885 13.6599C10.885 12.9569 10.65 12.5069 10.378 12.2719C12.047 12.0849 13.8 11.4469 13.8 8.56889C13.8 7.74389 13.51 7.07889 13.031 6.55389C13.106 6.36589 13.369 5.59689 12.956 4.56589C12.956 4.56589 12.328 4.35989 10.894 5.33489C10.2833 5.16609 9.65257 5.08098 9.019 5.08189C8.38543 5.08098 7.75467 5.16609 7.144 5.33489C5.709 4.36889 5.081 4.56589 5.081 4.56589C4.669 5.59689 4.931 6.36589 5.006 6.55389C4.50192 7.10281 4.2268 7.8237 4.237 8.56889C4.237 11.4379 5.981 12.0849 7.65 12.2719C7.434 12.4599 7.237 12.7879 7.172 13.2749C6.741 13.4719 5.662 13.7909 4.988 12.6569C4.847 12.4319 4.425 11.8789 3.834 11.8879C3.206 11.8979 3.581 12.2439 3.844 12.3849C4.162 12.5629 4.528 13.2289 4.612 13.4449C4.762 13.8659 5.25 14.6719 7.134 14.3249C7.134 14.9539 7.144 15.5449 7.144 15.7219C7.144 15.9189 7.004 16.1439 6.628 16.0789C5.13457 15.581 3.83567 14.6258 2.91531 13.3487C1.99495 12.0715 1.4998 10.5371 1.5 8.96289C1.5 4.81889 4.856 1.46289 9 1.46289Z" fill="currentColor"></path></svg></span><span class="text-sm font-medium text-tg-text-color-secondary">1.6k</span></a><a target="_blank" rel="noopener noreferrer" aria-label="Discord" class="flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none size-8" href="https://pimjo.com/community"><span class="shrink-0"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.7271 3.76687C13.6435 3.2681 12.499 2.91407 11.3231 2.71387C11.1631 3.00387 11.0177 3.30087 10.8871 3.60487C9.63489 3.41499 8.36125 3.41499 7.10907 3.60487C6.97853 3.30118 6.83302 3.00415 6.67307 2.71487C5.49628 2.91657 4.35091 3.27124 3.26607 3.76987C1.11207 6.97387 0.528069 10.0989 0.820069 13.1789C2.08069 14.1153 3.49293 14.828 4.99507 15.2859C5.33374 14.8279 5.63174 14.3445 5.88907 13.8359C5.40107 13.6521 4.92996 13.4262 4.48107 13.1609C4.59974 13.0742 4.71474 12.9872 4.82607 12.8999C6.13095 13.5172 7.55652 13.8374 9.00007 13.8374C10.4436 13.8374 11.8692 13.5172 13.1741 12.8999C13.2874 12.9932 13.4024 13.0799 13.5191 13.1599C13.0677 13.4272 12.5977 13.6532 12.1091 13.8379C12.3657 14.3459 12.6634 14.8285 13.0021 15.2859C14.5059 14.8305 15.9195 14.118 17.1801 13.1799C17.5231 9.60787 16.5951 6.51187 14.7271 3.76687ZM6.26007 11.2849C5.44607 11.2849 4.77407 10.5419 4.77407 9.62887C4.77407 8.71587 5.42307 7.96687 6.25707 7.96687C7.09107 7.96687 7.75907 8.71587 7.74507 9.62887C7.73107 10.5419 7.08907 11.2849 6.26007 11.2849ZM11.7421 11.2849C10.9271 11.2849 10.2571 10.5419 10.2571 9.62887C10.2571 8.71587 10.9071 7.96687 11.7421 7.96687C12.5771 7.96687 13.2401 8.71587 13.2251 9.62887C13.2101 10.5419 12.5711 11.2849 11.7421 11.2849Z" fill="currentColor"></path></svg></span></a></div></div><div class="flex items-center gap-4"></div></div><button class="ml-4 flex size-10 cursor-pointer items-center justify-center rounded-lg border border-tg-border-1 shadow-menu-button drop-shadow-menu-button xl:hidden"><svg class="size-5 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="20" height="19" viewBox="0 0 20 19" fill="none"><path d="M18.9014 15.8232C19.5081 15.8235 20 16.3151 20 16.9219C19.9999 17.5286 19.508 18.0203 18.9014 18.0205H1.09961C0.492805 18.0204 0.00103015 17.5287 0.000976562 16.9219C0.000976492 16.315 0.492772 15.8233 1.09961 15.8232H18.9014ZM18.9004 7.91113C19.507 7.91137 19.9989 8.40311 19.999 9.00977C19.999 9.61653 19.5071 10.1082 18.9004 10.1084H1.09863C0.49185 10.1083 7.07328e-08 9.61658 0 9.00977C0.000131768 8.40306 0.491931 7.91128 1.09863 7.91113H18.9004ZM18.9004 0C19.5071 0.000232044 19.999 0.49187 19.999 1.09863C19.9988 1.70522 19.507 2.19703 18.9004 2.19727H1.09863C0.491979 2.19712 0.000210003 1.70527 0 1.09863C-7.07328e-08 0.491816 0.49185 0.000144938 1.09863 0H18.9004Z" fill="currentColor"></path></svg></button><div class="invisible fixed inset-0 z-9999 flex h-svh w-screen flex-col justify-between bg-white opacity-0 duration-200 xl:hidden"><div class="flex items-center justify-between gap-4 px-6 py-5"><div class="shrink-0"><a href="/"><img alt="Logo" loading="lazy" width="142" height="42" decoding="async" data-nimg="1" style="color:transparent" src="/images/tailgrids-full-logo.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></a></div><div><button class="flex size-10 cursor-pointer items-center justify-center rounded-lg border border-tg-border-1
1shadow-menu-button drop-shadow-menu-button"><svg class="size-8 text-gray-800" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none"><path d="M22.4668 8.47095C22.7597 8.17833 23.2345 8.17828 23.5273 8.47095C23.8202 8.76376 23.82 9.23858 23.5273 9.53149L17.0586 15.9993L23.5273 22.468C23.8202 22.7609 23.8201 23.2357 23.5273 23.5286C23.2345 23.8215 22.7597 23.8215 22.4668 23.5286L15.998 17.0598L9.53027 23.5286C9.23738 23.8215 8.76262 23.8215 8.46973 23.5286C8.17698 23.2357 8.17688 22.7609 8.46973 22.468L14.9375 15.9993L8.46973 9.53149C8.17683 9.2386 8.17683 8.76384 8.46973 8.47095C8.76263 8.17818 9.23742 8.17809 9.53027 8.47095L15.998 14.9387L22.4668 8.47095Z" fill="currentColor"></path></svg></button></div></div><div class="flex h-[calc(100vh-80px)] flex-1 flex-col justify-between overflow-y-auto"><div class="px-6"><ul><li class="border-b border-dashed border-gray-300 py-4.5 first:pt-0 last:pb-0 last-of-type:border-b-0"><a target="_self" class="flex w-full items-center justify-between gap-0.5 rounded-lg py-1.5 text-sm font-medium text-tg-text-color duration-200 group-hover:bg-gray-100 group-hover:text-tg-title-color" href="/docs/components">Components</a></li><li class="border-b border-dashed border-gray-300 py-4.5 first:pt-0 last:pb-0 last-of-type:border-b-0"><a target="_self" class="flex w-full items-center justify-between gap-0.5 rounded-lg py-1.5 text-sm font-medium text-tg-text-color duration-200 group-hover:bg-gray-100 group-hover:text-tg-title-color" href="/blocks">Blocks</a></li><li class="border-b border-dashed border-gray-300 py-4.5 first:pt-0 last:pb-0 last-of-type:border-b-0"><a target="_self" class="flex w-full items-center justify-between gap-0.5 rounded-lg py-1.5 text-sm font-medium text-tg-text-color duration-200 group-hover:bg-gray-100 group-hover:text-tg-title-color" href="/templates">Templates</a></li><li class="border-b border-dashed border-gray-300 py-4.5 first:pt-0 last:pb-0 last-of-type:border-b-0"><a target="_self" class="flex w-full items-center justify-between gap-0.5 rounded-lg py-1.5 text-sm font-medium text-tg-text-color duration-200 group-hover:bg-gray-100 group-hover:text-tg-title-color" href="/figma">Figma</a></li><li class="border-b border-dashed border-gray-300 py-4.5 first:pt-0 last:pb-0 last-of-type:border-b-0"><a target="_self" class="flex w-full items-center justify-between gap-0.5 rounded-lg py-1.5 text-sm font-medium text-tg-text-color duration-200 group-hover:bg-gray-100 group-hover:text-tg-title-color" href="/docs">Docs</a></li><li class="border-b border-dashed border-gray-300 py-4.5 first:pt-0 last:pb-0 last-of-type:border-b-0 relative"><button class="flex w-full cursor-pointer items-center justify-between gap-0.5 rounded-lg py-1.5 text-sm font-medium text-tg-text-color duration-200 group-hover:bg-gray-100 group-hover:text-tg-title-color">Resources<span class="duration-200"><svg class="size-5 text-gray-500" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.35352 5.17676L6.99935 8.82259L10.6452 5.17676" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"></path></svg></span></button></li></ul></div><div class="p-6"><div class="flex flex-col items-center"><div class="mb-8"><div class="flex items-center justify-start gap-2"><a target="_blank" rel="noopener noreferrer" aria-label="X" class="flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none size-8" href="https://x.com/tailgrids"><span class="shrink-0"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.0532 2.625H15.2132L10.4922 8.025L16.0472 15.375H11.6972L8.29117 10.918L4.39217 15.375H2.23017L7.28017 9.598L1.95117 2.625H6.41117L9.49117 6.699L13.0532 2.625ZM12.2932 14.08H13.4922L5.76017 3.852H4.47617L12.2952 14.08H12.2932Z" fill="currentColor"></path></svg></span></a><a target="_blank" rel="noopener noreferrer" aria-label="Github" class="flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none h-8 w-[63px] gap-1.5" href="https://github.com/Tailgrids/tailgrids"><span class="shrink-0">
1<svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 1.46289C13.144 1.46289 16.5 4.81889 16.5 8.96289C16.5 10.5345 16.0068 12.0666 15.0901 13.3432C14.1734 14.6198 12.8792 15.5766 11.39 16.0789C11.016 16.1539 10.875 15.9189 10.875 15.7219C10.875 15.4689 10.885 14.6629 10.885 13.6599C10.885 12.9569 10.65 12.5069 10.378 12.2719C12.047 12.0849 13.8 11.4469 13.8 8.56889C13.8 7.74389 13.51 7.07889 13.031 6.55389C13.106 6.36589 13.369 5.59689 12.956 4.56589C12.956 4.56589 12.328 4.35989 10.894 5.33489C10.2833 5.16609 9.65257 5.08098 9.019 5.08189C8.38543 5.08098 7.75467 5.16609 7.144 5.33489C5.709 4.36889 5.081 4.56589 5.081 4.56589C4.669 5.59689 4.931 6.36589 5.006 6.55389C4.50192 7.10281 4.2268 7.8237 4.237 8.56889C4.237 11.4379 5.981 12.0849 7.65 12.2719C7.434 12.4599 7.237 12.7879 7.172 13.2749C6.741 13.4719 5.662 13.7909 4.988 12.6569C4.847 12.4319 4.425 11.8789 3.834 11.8879C3.206 11.8979 3.581 12.2439 3.844 12.3849C4.162 12.5629 4.528 13.2289 4.612 13.4449C4.762 13.8659 5.25 14.6719 7.134 14.3249C7.134 14.9539 7.144 15.5449 7.144 15.7219C7.144 15.9189 7.004 16.1439 6.628 16.0789C5.13457 15.581 3.83567 14.6258 2.91531 13.3487C1.99495 12.0715 1.4998 10.5371 1.5 8.96289C1.5 4.81889 4.856 1.46289 9 1.46289Z" fill="currentColor"></path></svg></span><span class="text-sm font-medium text-tg-text-color-secondary">1.6k</span></a><a target="_blank" rel="noopener noreferrer" aria-label="Discord" class="flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none size-8" href="https://pimjo.com/community"><span class="shrink-0"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.7271 3.76687C13.6435 3.2681 12.499 2.91407 11.3231 2.71387C11.1631 3.00387 11.0177 3.30087 10.8871 3.60487C9.63489 3.41499 8.36125 3.41499 7.10907 3.60487C6.97853 3.30118 6.83302 3.00415 6.67307 2.71487C5.49628 2.91657 4.35091 3.27124 3.26607 3.76987C1.11207 6.97387 0.528069 10.0989 0.820069 13.1789C2.08069 14.1153 3.49293 14.828 4.99507 15.2859C5.33374 14.8279 5.63174 14.3445 5.88907 13.8359C5.40107 13.6521 4.92996 13.4262 4.48107 13.1609C4.59974 13.0742 4.71474 12.9872 4.82607 12.8999C6.13095 13.5172 7.55652 13.8374 9.00007 13.8374C10.4436 13.8374 11.8692 13.5172 13.1741 12.8999C13.2874 12.9932 13.4024 13.0799 13.5191 13.1599C13.0677 13.4272 12.5977 13.6532 12.1091 13.8379C12.3657 14.3459 12.6634 14.8285 13.0021 15.2859C14.5059 14.8305 15.9195 14.118 17.1801 13.1799C17.5231 9.60787 16.5951 6.51187 14.7271 3.76687ZM6.26007 11.2849C5.44607 11.2849 4.77407 10.5419 4.77407 9.62887C4.77407 8.71587 5.42307 7.96687 6.25707 7.96687C7.09107 7.96687 7.75907 8.71587 7.74507 9.62887C7.73107 10.5419 7.08907 11.2849 6.26007 11.2849ZM11.7421 11.2849C10.9271 11.2849 10.2571 10.5419 10.2571 9.62887C10.2571 8.71587 10.9071 7.96687 11.7421 7.96687C12.5771 7.96687 13.2401 8.71587 13.2251 9.62887C13.2101 10.5419 12.5711 11.2849 11.7421 11.2849Z" fill="currentColor"></path></svg></span></a></div></div><div class="flex w-full flex-col items-center gap-3"><a class="cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm font-medium duration-200 focus-visible:outline-none disabled:pointer-events-none bg-gray-800 hover:bg-gray-900 text-white shadow-secondary-button flex h-10.5 w-full whitespace-nowrap" aria-disabled="false" aria-busy="false" href="/pricing">Pricing & FAQ</a><a class="flex h-11 cursor-pointer items-center justify-center text-sm font-medium whitespace-nowrap text-tg-text-color hover:text-tg-title-color" href="/signin">Sign In</a></div></div></div></div></div></div></div></header></div></div><div class="flex-1"><section class="overflow-hidden"><div class="relative z-10 mx-auto w-full max-w-[1456px]"><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="absolute -inset-x-30 top-0">
1<svg width="1375" height="461" viewBox="0 0 1375 461" fill="none" xmlns="http://www.w3.org/2000/svg"><g opacity="0.3" filter="url(#filter0_f_13199_19207)"><path d="M1228.8 -292.162L1090.61 -430.353L437.444 222.812L575.636 361.003L1228.8 -292.162Z" fill="url(#paint0_linear_13199_19207)"></path></g><g opacity="0.3" filter="url(#filter1_f_13199_19207)"><path d="M1521.87 -280.864L1383.68 -419.056L547.496 417.127L685.688 555.319L1521.87 -280.864Z" fill="url(#paint1_linear_13199_19207)"></path></g><g opacity="0.8" filter="url(#filter2_f_13199_19207)"><path d="M1452.78 -349.96L1314.58 -488.152L683.272 143.16L821.464 281.351L1452.78 -349.96Z" fill="url(#paint2_linear_13199_19207)"></path></g><g opacity="0.3" filter="url(#filter3_f_13199_19207)"><path d="M843.861 -493.79L778.811 -558.84L36.154 183.817L101.204 248.867L843.861 -493.79Z" fill="url(#paint3_linear_13199_19207)"></path></g><g opacity="0.3" filter="url(#filter4_f_13199_19207)"><path d="M695.492 -305.016L652.215 -348.293L20.9035 283.018L64.1808 326.295L695.492 -305.016Z" fill="url(#paint4_linear_13199_19207)"></path></g><defs><filter id="filter0_f_13199_19207" x="406.443" y="-461.353" width="853.357" height="853.356" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="15.5" result="effect1_foregroundBlur_13199_19207"></feGaussianBlur></filter><filter id="filter1_f_13199_19207" x="516.496" y="-450.056" width="1036.38" height="1036.37" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="15.5" result="effect1_foregroundBlur_13199_19207"></feGaussianBlur></filter><filter id="filter2_f_13199_19207" x="629.273" y="-542.151" width="877.502" height="877.503" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="27" result="effect1_foregroundBlur_13199_19207"></feGaussianBlur></filter><filter id="filter3_f_13199_19207" x="-17.8457" y="-612.84" width="915.707" height="915.707" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="27" result="effect1_foregroundBlur_13199_19207"></feGaussianBlur></filter><filter id="filter4_f_13199_19207" x="-33.0957" y="-402.293" width="782.588" height="782.589" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="27" result="effect1_foregroundBlur_13199_19207"></feGaussianBlur></filter><linearGradient id="paint0_linear_13199_19207" x1="1139.27" y1="-381.69" x2="486.107" y2="271.474" gradientUnits="userSpaceOnUse"><stop stop-color="#F472B6"></stop><stop offset="0.8" stop-color="#F472B6" stop-opacity="0"></stop></linearGradient><linearGradient id="paint1_linear_13199_19207" x1="1432.34" y1="-370.393" x2="596.159" y2="465.79" gradientUnits="userSpaceOnUse"><stop stop-color="#3758F9"></stop><stop offset="0.8" stop-color="#3758F9" stop-opacity="0"></stop></linearGradient><linearGradient id="paint2_linear_13199_19207" x1="1383.68" y1="-419.056" x2="752.368" y2="212.256" gradientUnits="userSpaceOnUse"><stop stop-color="#3758F9"></stop><stop offset="0.88" stop-color="#3758F9" stop-opacity="0"></stop></linearGradient><linearGradient id="paint3_linear_13199_19207" x1="811.336" y1="-526.315" x2="68.6789" y2="216.342" gradientUnits="userSpaceOnUse"><stop stop-color="#3758F9"></stop><stop offset="0.88" stop-color="#3758F9" stop-opacity="0"></stop></linearGradient><linearGradient id="paint4_linear_13199_19207" x1="673.854" y1="-326.655" x2="42.5422" y2="304.657" gradientUnits="userSpaceOnUse"><stop stop-color="#3758F9"></stop><stop offset="0.88" stop-color="#3758F9" stop-opacity="0"></stop></linearGradient></defs></svg></div><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="relative z-10 p-5 min-[1440px]:pb-102"><div class="mx-auto flex max-w-[740px] flex-col items-center pt-10 pb-14 text-center min-[1440px]:m-0 min-[1440px]:items-start min-[1440px]:text-left md:pt-20 xl
1:pl-5"><span class="mb-8 items-center justify-start gap-2.5 rounded-3xl border border-tg-border-1 bg-white p-1.5 pr-4 font-mono text-sm -tracking-[.2px] text-gray-700 max-[470px]:px-5 sm:inline-flex"><span class="flex justify-center -space-x-1.5 *:size-6 *:overflow-hidden *:rounded-full *:border-2 *:border-white *:object-cover *:object-center *:not-first:z-10 min-[1440px]:justify-start"><img alt="Avatar 1" loading="lazy" width="24" height="24" decoding="async" data-nimg="1" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Fhero%2Fimage-1.png&w=32&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Fhero%2Fimage-1.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Fhero%2Fimage-1.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/><img alt="Avatar 2" loading="lazy" width="24" height="24" decoding="async" data-nimg="1" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Fhero%2Fimage-2.png&w=32&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Fhero%2Fimage-2.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Fhero%2Fimage-2.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/><img alt="Avatar 3" loading="lazy" width="24" height="24" decoding="async" data-nimg="1" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Fhero%2Fimage-3.png&w=32&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Fhero%2Fimage-3.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Fhero%2Fimage-3.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/><img alt="Avatar 4" loading="lazy" width="24" height="24" decoding="async" data-nimg="1" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Fhero%2Fimage-4.png&w=32&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Fhero%2Fimage-4.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Fhero%2Fimage-4.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></span>Trusted by 150k+ developers, designers and teams worldwide</span><h1 class="mb-4.5 text-3xl font-semibold -tracking-[1.52px] text-tg-title-color sm:text-4xl md:text-5xl lg:text-[52px]/[58px]">React UI Components, Powered by Tailwind CSS</h1><p class="text-base leading-normal -tracking-[.2px] text-gray-700">A complete React component library built for production. Ship modern web apps faster with 600+ free components, blocks, and templates in one unified React, Tailwind and Figma UI library. Built for developers and designers, optimized for performance, accessibility, and consistency. AI-workflow ready, with a full Figma design system and React UI system included.</p><div class="mt-8 flex gap-3 max-sm:flex-col"><div class="group inline-flex h-11 min-w-[250px] items-center justify-between gap-3 rounded-xl bg-[#F7F7F7] pr-2 pl-4.5 shadow-[0_0_0_1px_#E5E7EB,0_4px_8px_-1.5px_rgba(51,51,51,0.06)]"><span class="font-mono text-sm font-medium -tracking-[.2px] text-gray-700">npx @tailgrids/cli@latest init</span><button class="flex h-7.5 w-9.5 cursor-pointer items-center justify-center rounded-lg bg-white text-tg-text-color-secondary shadow-[0_0_0_1px_#E5E7EB,0_4px_8px_-1.5px_rgba(51,51,51,0.06)] transition-colors hover:bg-gray-50" aria-label="Copy to clipboard"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.8999 12.951H6.53808C5.91676 12.951 5.41309 12.4474 5.41309 11.826V5.46423M12.8999 12.951L12.8999 14.079C12.8999 14.7003 12.3962 15.204 11.7749 15.204H4.28516C3.66384 15.204 3.16016 14.7003 3.16016 14.079V6.58923C3.16016 5.96791 3.66384 5.46423 4.28516 5.46423H5.41309M12.8999 12.951H14.0326C14.6539 12.951 15.1576 12.4474 15.1576 11.826L15.1576 4.33008C15.1576 3.70876 14.6539 3.20508 14.0326 3.20508H6.53809C5.91677 3.20508 5.41309 3.70876 5.41309 4.33008V5.46423" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></div><a class="inline-flex h-11 cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm duration-200 focus-visible:outline-none disabled:pointer-events-none bg-primary-500 hover:bg-primary-600 text-white shadow-primary-button pr-3 font-medium" aria-disabled="false" aria-busy="false" href="/docs/components">
1Browse All <span class="text-white/30">-</span> Components<svg class="size-5" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.91732 14.1667L12.084 10L7.91732 5.83335" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"></path></svg></a></div></div><div class="hidden min-[1440px]:block"><div class="absolute top-20 right-0 h-px w-[453px] bg-linear-to-r from-transparent via-[#EDEDED] via-20% to-[#EDEDED]"><div class="relative p-5"><div class="absolute top-0 left-31.5 h-full w-px bg-gray-200"></div><div class="ml-auto max-w-[288px] rounded-xl border border-gray-200 bg-white p-1.5"><ul><li><button class="flex w-full cursor-pointer items-center justify-between rounded-lg px-3 py-2.5 text-left text-sm font-medium -tracking-[0.2px] transition-colors text-gray-700 hover:bg-gray-100">User Profile</button></li><li><button class="flex w-full cursor-pointer items-center justify-between rounded-lg px-3 py-2.5 text-left text-sm font-medium -tracking-[0.2px] transition-colors bg-gray-100 text-gray-900">Account Settings</button></li><li><button class="flex w-full cursor-pointer items-center justify-between rounded-lg px-3 py-2.5 text-left text-sm font-medium -tracking-[0.2px] transition-colors text-gray-700 hover:bg-gray-100">Language & Region</button></li><li><button class="flex w-full cursor-pointer items-center justify-between rounded-lg px-3 py-2.5 text-left text-sm font-medium -tracking-[0.2px] transition-colors text-gray-700 hover:bg-gray-100">Support</button></li><li><button class="flex w-full cursor-pointer items-center justify-between rounded-lg px-3 py-2.5 text-left text-sm font-medium -tracking-[0.2px] transition-colors text-gray-700 hover:bg-gray-100">Billing & Plans</button></li></ul></div><div class="absolute bottom-0 -left-7"><div class="relative"><div class="mb-5 flex justify-end"><button type="button" class="flex h-6 w-11 cursor-pointer items-center rounded-full p-1 transition-all duration-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 bg-primary-500"><div class="h-5 w-5 transform rounded-full bg-white shadow-sm transition-all duration-300 translate-x-4.5"></div></button></div><div class="flex items-center gap-5 pb-5"><div><button type="button" class="flex h-6 w-11 cursor-pointer items-center rounded-full p-1 transition-all duration-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 bg-gray-200"><div class="h-5 w-5 transform rounded-full bg-white shadow-sm transition-all duration-300 -translate-x-0.5"></div></button></div><div><button class="cursor-pointer rounded-lg bg-primary-500 px-3.5 py-2.5 text-sm font-medium text-white transition hover:bg-primary-600">Button</button></div></div><div class="absolute -right-4.5 h-px w-[265px] bg-linear-to-r from-transparent via-[#EDEDED] via-25% to-[#EDEDED]"></div></div><div class="py-5"><label for="remember" class="flex cursor-pointer items-center gap-3"><input id="remember" type="checkbox" class="h-5 w-5 cursor-pointer rounded-md border border-gray-300 transition duration-200 checked:border-blue-600 checked:bg-blue-600 focus:ring-2 focus:ring-blue-500/30"/><span class="text-sm">Remember Me</span></label></div></div><div class="absolute right-0 bottom-0 h-px w-[600px] bg-linear-to-r from-transparent via-[#EDEDED] via-15% to-[#EDEDED]"></div></div></div><div class="absolute top-83.5 right-0 border-l border-gray-200 px-4.5 py-5"><nav class="flex h-10 rounded-lg border border-gray-200"><button class="flex cursor-pointer items-center gap-2 rounded-l-lg border-r border-gray-200 px-3.5 py-2.5 text-sm font-medium transition hover:bg-gray-100"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="size-5"><path d="M3.99976 11.9966L20.0011 11.9966M9.99575 6L3.99976 11.9998L9.99575 18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg> Previous</button><ul class="flex divide-x divide-gray-200"><li><button class="inline-flex size-9.5 cursor-pointer items-center justify-center text-sm font-medium transition-colors bg-gray-100 text-gray-900 ">1</button></li><li><button class="inline-flex size-9.5 cursor-pointer items-center justify-center text-sm font-medium transition-colors text-tg-text-color hover:bg-gray-100 ">2</button></li><li><button class="inline-flex size-9.5 cursor-pointer items-center justify-center text-sm font-medium transition-colors text-tg-text-color hover:bg-gray-100 ">3</button></li><li><button class="inline-flex size-9.5 cursor-pointer items-center justify-center text-sm font-medium transition-colors text-tg-text-color hover:bg-gray-100 cursor-default">...</button></li><li><button class="inline-flex size-9.5 cursor-pointer items-center justify-center text-sm font-medium transition-colors text-tg-text-color hover:bg-gray-100 ">8</button></li><li><button class="inline-flex size-9.5 cursor-pointer items-center justify-center text-sm font-medium transition-colors text-tg-text-color hover:bg-gray-100 ">9</button></li></ul><button class="flex cursor-pointer items-center gap-2 rounded-r-lg border-l border-gray-200 px-3.5 py-2.5 text-sm font-medium transition hover:bg-gray-100">Next <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="size-5"><path d="M19.7226 11.9966L3.72125 11.9966M13.7266 6L19.7226 11.9998L13.7266 18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></nav></div><div class="absolute top-103.5 right-0 flex divide-x divide-gray-200 rounded-tl-2xl border-t border-l border-gray-200"><div class="pt-5 pb-5"><div class="border-b border-gray-200 px-5 pb-5"><div class="flex items-center gap-5"><button class="flex shrink-0 cursor-pointer items-center gap-2 rounded-lg border border-gray-300 px-5 py-2.5 text-sm font-medium transition-colors hover:bg-gray-50"><svg class="animate-spin" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="10" cy="10" r="8.75" stroke="#E4E7EC" stroke-width="2.5"></circle><mask id="path-2-inside-1_16198_13754" fill="white"><path d="M18.2372 12.9506C18.8873 13.1835 19.6113 12.846 19.7613 12.1719C20.0138 11.
10369 20.0672 9.86319 19.9156 8.70384C19.7099 7.12996 19.1325 5.62766 18.2311 4.32117C17.3297 3.01467 16.1303 1.94151 14.7319 1.19042C13.7019 0.637155 12.5858 0.270357 11.435 0.103491C10.7516 0.00440265 10.179 0.561473 10.1659 1.25187C10.1528 1.94226 10.7059 2.50202 11.3845 2.6295C12.1384 2.77112 12.8686 3.02803 13.5487 3.39333C14.5973 3.95661 15.4968 4.76141 16.1728 5.74121C16.8488 6.721 17.2819 7.84764 17.4361 9.02796C17.5362 9.79345 17.5172 10.5673 17.3819 11.3223C17.2602 12.002 17.5871 12.7178 18.2372 12.9506Z"></path></mask><path d="M18.2372 12.9506C18.8873 13.1835 19.6113 12.846 19.7613 12.1719C20.0138 11.0369 20.0672 9.86319 19.9156 8.70384C19.7099 7.12996 19.1325 5.62766 18.2311 4.32117C17.3297 3.01467 16.1303 1.94151 14.7319 1.19042C13.7019 0.637155 12.5858 0.270357 11.435 0.103491C10.7516 0.00440265 10.179 0.561473 10.1659 1.25187C10.1528 1.94226 10.7059 2.50202 11.3845 2.6295C12.1384 2.77112 12.8686 3.02803 13.5487 3.39333C14.5973 3.95661 15.4968 4.76141 16.1728 5.74121C16.8488 6.721 17.2819 7.84764 17.4361 9.02796C17.5362 9.79345 17.5172 10.5673 17.3819 11.3223C17.2602 12.002 17.5871 12.7178 18.2372 12.9506Z" stroke="#465FFF" stroke-width="4" mask="url(#path-2-inside-1_16198_13754)"></path></svg>Loading</button><div class="flex items-center gap-3"><div class="h-2 w-[155px] overflow-hidden rounded-full bg-gray-200"><div class="h-full rounded-full bg-primary-500 transition-[width] duration-75 ease-linear" style="width:0%"></div></div><span class="w-[36px] shrink-0 text-right text-sm font-medium text-gray-800 tabular-nums">0<!-- -->%</span></div></div></div><div class="border-b border-gray-200 p-5"><div class="relative"><button type="button" class="flex h-11 w-full cursor-pointer items-center justify-between rounded-lg border border-gray-300 px-4 text-sm font-medium text-gray-800 transition-colors focus:border-primary-500 focus:ring-4 focus:ring-primary-300/20 focus:outline-none"><span>All Projects</span><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="size-5 text-gray-500 transition-transform duration-200 "><path d="M5.75 8.875L12 15.125L18.25 8.875" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></div></div><div class="p-5"><div class="rounded-2xl border border-gray-200 p-5"><div class="mb-4"><h3 class="text-lg font-semibold -tracking-[0.2px] text-gray-800">Active Users</h3></div><div class="mb-5 flex items-end gap-1.5"><div class="flex items-center gap-2.5"><span class="relative inline-block h-5 w-5"><span class="absolute top-1/2 left-1/2 h-2 w-2 -translate-x-1/2 -translate-y-1/2 transform rounded-full bg-red-500"><span class="absolute -top-1 -left-1 inline-flex h-4 w-4 animate-ping rounded-full bg-red-400 opacity-75"></span> </span></span><span class="text-3xl font-semibold text-gray-800">364</span></div><span class="mb-1 block text-sm text-gray-500">Live visitors</span></div><div class="h-full rounded-xl bg-gray-50"><!--$!--><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><!--/$--></div></div></div></div><div class="p-5"><div class="w-[304px] rounded-2xl border border-gray-200 bg-white p-5"><div class="mb-4 flex justify-between"><h3 class="text-lg font-semibold text-gray-800">Traffic Stats</h3></div><div class="flex h-10 w-full rounded-[10px] bg-gray-100 p-0.5"><button class="flex w-full cursor-pointer items-center justify-center rounded-lg px-3 py-2.5 text-sm font-medium transition-all duration-200 bg-white text-gray-800 shadow-sm">Today</button><button class="flex w-full cursor-pointer items-center justify-center rounded-lg px-3 py-2.5 text-sm font-medium transition-all duration-200 bg-transparent text-gray-500 hover:text-gray-700">Week</button><button class="flex w-full cursor-pointer items-center justify-center rounded-lg px-3 py-2.5 text-sm font-medium transition-all duration-200 bg-transparent text-gray-500 hover:text-gray-700">Month</button></div><div class="mt-2 divide-y divide-gray-100"><div class="py-5 first:pt-4 last:pb-0"><p class="mb-1 text-sm text-gray-500">New Subscribers</p><div class="flex items-end justify-between"><div><h4 class="mb-1 text-2xl font-semibold text-gray-800">2.4K</h4><div class="flex items-center gap-1.5"><span class="text-sm font-medium text-green-500">+3.85%</span><span class="text-xs text-gray-500">than last<!-- --> <!-- -->day</span></div></div><div class="w-[100px]"><!--$!--><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><!--/$--></div></div></div><div class="py-5 first:pt-4 last:pb-0"><p class="mb-1 text-sm text-gray-500">Conversion Rate</p><div class="flex items-end justify-between"><div><h4 class="mb-1 text-2xl font-semibold text-gray-800">1.2K</h4><div class="flex items-center gap-1.5"><span class="text-sm font-medium text-red-500">-5.39%</span><span class="text-xs text-gray-500">than last<!-- --> <!-- -->day</span></div></div><div class="w-[100px]"><!--$!--><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><!--/$--></div></div></div><div class="py-5 first:pt-4 last:pb-0"><p class="mb-1 text-sm text-gray-500">Page Bounce Rate</p><div class="flex items-end justify-between"><div><h4 class="mb-1 text-2xl font-semibold text-gray-800">285</h4><div class="flex items-center gap-1.5"><span class="text-sm font-medium text-green-500">+12.74%</span><span class="text-xs text-gray-500">than last<!-- --> <!-- -->day</span></div></div><div class="w-[100px]"><!--$!--><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><!--/$--></div></div></div></div></div></div></div><div class="absolute mt-5 min-[1440px]:left-53.5 2xl:left-61"><div class="mb-4.5"><div class="flex justify-end">
1<div class="mb-5 flex -space-x-3"><img src="/images/demo-avatar/avatar-1.png" class="size-10 rounded-full ring-1 ring-white" alt="Avatar 1"/><img src="/images/demo-avatar/avatar-2.png" class="size-10 rounded-full ring-1 ring-white" alt="Avatar 2"/><img src="/images/demo-avatar/avatar-3.png" class="size-10 rounded-full ring-1 ring-white" alt="Avatar 3"/><img src="/images/demo-avatar/avatar-4.png" class="size-10 rounded-full ring-1 ring-white" alt="Avatar 4"/></div></div><div class="flex h-10 w-full rounded-[10px] bg-gray-100 p-0.5"><button class="flex w-full cursor-pointer items-center justify-center rounded-lg px-3 py-2.5 text-sm font-medium transition-all duration-200 bg-white text-gray-800 shadow-sm">Overview</button><button class="flex w-full cursor-pointer items-center justify-center rounded-lg px-3 py-2.5 text-sm font-medium transition-all duration-200 bg-transparent text-gray-500 hover:text-gray-700">Notification</button><button class="flex w-full cursor-pointer items-center justify-center rounded-lg px-3 py-2.5 text-sm font-medium transition-all duration-200 bg-transparent text-gray-500 hover:text-gray-700">Analytics</button><button class="flex w-full cursor-pointer items-center justify-center rounded-lg px-3 py-2.5 text-sm font-medium transition-all duration-200 bg-transparent text-gray-500 hover:text-gray-700">Customers</button></div></div><div class="mt-4"><div class="w-[380px] rounded-2xl border border-gray-200 bg-white p-4"><div class="mb-6 flex items-center justify-between"><h3 class="text-lg font-semibold -tracking-[0.2px] text-gray-800">Upcoming Schedule</h3></div><div class="space-y-2">
1<div class="flex cursor-pointer items-start gap-4 rounded-xl p-3 transition-all duration-200 bg-gray-50"><div class="pt-1"><label class="relative flex cursor-pointer items-center"><input type="checkbox" readOnly="" class="h-5 w-5 cursor-pointer rounded-md border border-gray-300 transition duration-200 checked:border-blue-600 checked:bg-blue-600 focus:ring-2 focus:ring-blue-500/30" checked=""/></label></div><div class="flex-1"><div class="flex items-start justify-between"><div class="mb-1"><p class="text-xs text-gray-500">Wed, 11 jan</p><p class="text-sm font-medium text-gray-800">09:20 AM</p></div><div class="flex-1 pl-6"><h4 class="mb-1 text-sm font-medium text-gray-800">Business Analytics Press</h4><p class="line-clamp-1 text-xs text-gray-500">Exploring the Future of Data-Driven +6 more</p></div></div></div></div><div class="flex cursor-pointer items-start gap-4 rounded-xl p-3 transition-all duration-200 bg-white hover:bg-gray-50"><div class="pt-1"><label class="relative flex cursor-pointer items-center"><input type="checkbox" readOnly="" class="h-5 w-5 cursor-pointer rounded-md border border-gray-300 transition duration-200 checked:border-blue-600 checked:bg-blue-600 focus:ring-2 focus:ring-blue-500/30"/></label></div><div class="flex-1"><div class="flex items-start justify-between"><div class="mb-1"><p class="text-xs text-gray-500">Fri, 15 feb</p><p class="text-sm font-medium text-gray-800">10:35 AM</p></div><div class="flex-1 pl-6"><h4 class="mb-1 text-sm font-medium text-gray-800">Business Sprint</h4><p class="line-clamp-1 text-xs text-gray-500">Techniques from Business Sprint +2 more</p></div></div></div></div></div></div></div></div></div></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
1<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="px-5 pb-8"><div class="-mt-[15px]"><div class="mb-6 flex justify-center"><span class="relative z-30 inline-block rounded-full border border-tg-border-1 bg-gray-50 px-3.5 py-1 text-center text-sm -tracking-[.2px] text-tg-text-color-secondary sm:text-left">Complete React UI System Built on Tailwind CSS<!-- --> </span></div><div><div class="flex flex-wrap items-center justify-center gap-1.5 gap-y-3"><div class="group flex items-center gap-1.5"><div class="relative flex items-center gap-2.5 rounded-full"><svg class="size-5" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16.444 6.834C16.231 6.7605 16.0163 6.69214 15.8 6.629C15.8367 6.47834 15.87 6.33034 15.9 6.185C16.387 3.792 16.068 1.864 14.98 1.229C13.937 0.620003 12.23 1.255 10.507 2.772C10.3417 2.918 10.1757 3.072 10.009 3.234C9.899 3.12734 9.78867 3.024 9.678 2.924C7.872 1.304 6.06 0.620003 4.974 1.257C3.932 1.867 3.624 3.679 4.062 5.947C4.104 6.167 4.15333 6.39034 4.21 6.617C3.95333 6.69034 3.70667 6.769 3.47 6.853C1.352 7.599 0 8.769 0 9.983C0 11.237 1.452 12.494 3.657 13.257C3.83167 13.317 4.01167 13.374 4.197 13.428C4.137 13.6747 4.085 13.9153 4.041 14.15C3.623 16.379 3.949 18.148 4.989 18.755C6.063 19.381 7.865 18.737 9.619 17.185C9.75833 17.063 9.89767 16.9337 10.037 16.797C10.217 16.973 10.397 17.1393 10.577 17.296C12.277 18.776 13.957 19.373 14.995 18.764C16.067 18.136 16.416 16.235 15.964 13.923C15.9282 13.7418 15.8882 13.5614 15.844 13.382C15.9707 13.344 16.0943 13.3047 16.215 13.264C18.508 12.496 20 11.254 20 9.983C20 8.765 18.604 7.586 16.444 6.834ZM15.947 12.444C15.837 12.4807 15.725 12.516 15.611 12.55C15.3327 11.6734 14.9942 10.817 14.598 9.987C14.997 9.117 15.325 8.267 15.571 7.462C15.7763 7.522 15.9747 7.58534 16.166 7.652C18.016 8.296 19.146 9.249 19.146 9.983C19.146 10.765 17.926 11.78 15.946 12.443L15.947 12.444ZM15.125 14.09C15.325 15.113 15.354 16.038 15.221 16.76C15.102 17.41 14.863 17.843 14.567 18.016C13.937 18.386 12.588 17.906 11.135 16.64C10.9683 16.4947 10.8007 16.3403 10.632 16.177C11.2391 15.498 11.799 14.7783 12.308 14.023C13.275 13.937 14.188 13.795 15.017 13.601C15.057 13.7677 15.093 13.93 15.125 14.09ZM6.818 17.953C6.203 18.173 5.712 18.179 5.416 18.006C4.785 17.638 4.523 16.217 4.88 14.311C4.92133 14.093 4.97 13.8693 5.026 13.64C5.846 13.823 6.752 13.955 7.722 14.034C8.24654 14.786 8.81976 15.5029 9.438 16.18C9.31133 16.3047 9.18467 16.423 9.058 16.535C8.281 17.221 7.504 17.708 6.818 17.953ZM3.933 12.439C2.958 12.102 2.153 11.664 1.601 11.185C1.105 10.755 0.854 10.329 0.854 9.983C0.854 9.246 1.94 8.307 3.751 7.668C3.971 7.59067 4.20033 7.51734 4.439 7.448C4.689 8.272 5.018 9.133 5.414 10.004C5.02828 10.845 4.69856 11.7105 4.427 12.595C4.26113 12.5469 4.09642 12.4949 3.933 12.439ZM4.901 5.78C4.525 3.837 4.774 2.371 5.402 2.004C6.072 1.612 7.552 2.17 9.111 3.571C9.211 3.661 9.311 3.75434 9.411 3.851C8.79734 4.52429 8.22813 5.2368 7.707 5.984C6.80924 6.06657 5.91773 6.20686 5.038 6.404C4.986 6.192 4.94033 5.984 4.901 5.78ZM13.528 7.935C13.3321 7.59342 13.1291 7.25602 12.919 6.923C13.558 7.005 14.169 7.113 14.743 7.246C14.5582 7.83675 14.3446 8.41811 14.103 8.988C13.9184 8.6332 13.7267 8.28213 13.528 7.935ZM10.009 4.47C10.404 4.902 10.799 5.384 11.187 5.907C10.3994 5.86973 9.61056 5.86973 8.823 5.907C9.21233 5.387 9.60767 4.908 10.009 4.47ZM6.47 7.94C6.27372 8.28432 6.08534 8.63308 5.905 8.986C5.66487 8.4134 5.45294 7.82936 5.27 7.236C5.84 7.106 6.449 7.001 7.083 6.921C6.873 7.25234 6.66867 7.592 6.47 7.94ZM7.101 13.105C6.48189 13.037 5.86673 12.9368 5.258 12.805C5.435 12.228 5.652 11.629 5.906 11.019C6.2716 11.7327 6.67003 12.4291 7.1 13.106L7.101 13.105ZM10.034
115.557C9.629 15.115 9.225 14.627 8.831 14.1C9.62308 14.1301 10.416 14.1287 11.208 14.096C10.818 14.631 10.426 15.121 10.034 15.557ZM14.112 10.987C14.3807 11.605 14.6047 12.1983 14.784 12.767C14.204 12.901 13.578 13.009 12.918 13.089C13.3432 12.4045 13.7415 11.7026 14.112 10.987ZM12.792 11.628C12.4892 12.1604 12.169 12.6826 11.832 13.194C11.2373 13.2373 10.627 13.259 10.001 13.259C9.37767 13.259 8.77433 13.2397 8.191 13.201C7.50127 12.1826 6.88953 11.1136 6.361 10.003C6.88516 8.89371 7.49361 7.82625 8.181 6.81C9.39458 6.71755 10.6134 6.71755 11.827 6.81C12.5033 7.82971 13.1132 8.8919 13.653 9.99C13.3855 10.546 13.0983 11.0924 12.792 11.628ZM14.554 1.977C15.224 2.367 15.484 3.943 15.064 6.009C15.0373 6.141 15.0073 6.275 14.974 6.411C14.0933 6.20842 13.2 6.06576 12.3 5.984C11.7858 5.23511 11.2211 4.52213 10.61 3.85C10.7633 3.7 10.9167 3.55767 11.07 3.423C12.546 2.123 13.926 1.61 14.554 1.977ZM10 8.176C10.986 8.176 11.786 8.986 11.786 9.983C11.786 10.981 10.986 11.789 10 11.789C9.76414 11.7877 9.53086 11.7399 9.31346 11.6485C9.09606 11.557 8.8988 11.4236 8.73296 11.2559C8.56711 11.0882 8.43592 10.8895 8.34688 10.6711C8.25784 10.4527 8.21268 10.2189 8.214 9.983C8.214 8.985 9.014 8.176 10 8.176Z" fill="#23B2E7"></path></svg><span class="text-sm font-medium -tracking-[.2px] text-tg-text-color-secondary">React</span></div><span class="flex size-5 items-center justify-center group-last-of-type:hidden"><span class="block size-0.5 rounded-full bg-[#ccc]"></span></span></div><div class="group flex items-center gap-1.5"><div class="relative flex items-center gap-2.5 rounded-full"><svg class="size-5" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M10 5C7.33333 5 5.66667 6.11133 5 8.334C6 7.222 7.16667 6.80533 8.5 7.084C9.26 7.242 9.805 7.702 10.406 8.211C11.386 9.041 12.522 10 15 10C17.6667 10 19.3333 8.889 20 6.667C19 7.77833 17.8333 8.195 16.5 7.9
117C15.74 7.758 15.195 7.298 14.594 6.789C13.614 5.96 12.479 5 10 5ZM5 10C2.33333 10 0.666667 11.1113 0 13.334C1 12.222 2.16667 11.8053 3.5 12.084C4.26 12.242 4.805 12.702 5.406 13.211C6.386 14.041 7.521 15 10 15C12.6667 15 14.3333 13.889 15 11.667C14 12.7783 12.8333 13.195 11.5 12.917C10.74 12.758 10.195 12.298 9.594 11.789C8.614 10.96 7.478 10 5 10Z" fill="#23B2E7"></path></svg><span class="text-sm font-medium -tracking-[.2px] text-tg-text-color-secondary">Tailwind CSS</span></div><span class="flex size-5 items-center justify-center group-last-of-type:hidden"><span class="block size-0.5 rounded-full bg-[#ccc]"></span></span></div><div class="group flex items-center gap-1.5"><div class="relative flex items-center gap-2.5 rounded-full"><svg class="size-5" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M10 10C10 9.33696 10.2634 8.70107 10.7322 8.23223C11.2011 7.76339 11.837 7.5 12.5 7.5C13.163 7.5 13.7989 7.76339 14.2678 8.23223C14.7366 8.70107 15 9.33696 15 10C15 10.663 14.7366 11.2989 14.2678 11.7678C13.7989 12.2366 13.163 12.5 12.5 12.5C11.837 12.5 11.2011 12.2366 10.7322 11.7678C10.2634 11.2989 10 10.663 10 10Z" fill="#1ABCFE"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5 15C5 14.337 5.26339 13.7011 5.73223 13.2322C6.20107 12.7634 6.83696 12.5 7.5 12.5H10V15C10 15.663 9.73661 16.2989 9.26777 16.7678C8.79893 17.2366 8.16304 17.5 7.5 17.5C6.83696 17.5 6.20107 17.2366 5.73223 16.7678C5.26339 16.2989 5 15.663 5 15Z" fill="#0ACF83"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M10 2.5V7.5H12.5C13.163 7.5 13.7989 7.23661 14.2678 6.76777C14.7366 6.29893 15 5.66304 15 5C15 4.33696 14.7366 3.70107 14.2678 3.23223C13.7989 2.76339 13.163 2.5 12.5 2.5H10Z" fill="#FF7262"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5 5C5 5.66304 5.26339 6.29893 5.73223 6.76777C6.20107 7.23661 6.83696 7.5 7.5 7.5H10V2.5H7.5C6.83696 2.5 6.20107 2.76339 5.73223 3.23223C5.26339 3.70107 5 4.33696 5 5Z" fill="#F24E1E"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5 10C5 10.663 5.26339 11.2989 5.73223 11.7678C6.20107 12.2366 6.83696 12.5 7.5 12.5H10V7.5H7.5C6.83696 7.5 6.20107 7.76339 5.73223 8.23223C5.26339 8.70107 5 9.33696 5 10Z" fill="#A259FF"></path></svg><span class="text-sm font-medium -tracking-[.2px] text-tg-text-color-secondary">Figma</span></div><span class="flex size-5 items-center justify-center group-last-of-type:hidden"><span class="block size-0.5 rounded-full bg-[#ccc]"></span></span></div></div></div></div></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
1<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div></div></section><section><div class="mx-auto max-w-[1456px] px-5 sm:px-10"><div class="items-center lg:grid lg:grid-cols-4"><div class="px-10 pt-10 lg:col-span-1 lg:py-2.5"><h2 class="text-center text-sm -tracking-[.084px] text-tg-text-color-secondary lg:text-left">Trusted by<!-- --> <span class="font-semibold text-tg-title-color">150,000+ </span> <!-- -->devs, designers, and teams worldwide.</h2></div><div class="relative py-11 lg:col-span-3" style="mask-image:linear-gradient(to right, transparent, black 20%, black 80%, transparent)"></div></div></div></section><section class="overflow-hidden"><div class="relative mx-auto w-full max-w-[1456px]"><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="p-5 pt-10 sm:p-10 sm:pt-20"><div class="w-full max-w-[800px]"><div class="mb-4"><span class="inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium text-tg-text-color-secondary" style="box-shadow:0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.22949 1.77721C8.71502 1.53447 9.28691 1.53455 9.77246 1.77721L14.9912 4.38659C15.5753 4.67885 15.9443 5.27637 15.9443 5.92956V12.0712C15.9442 12.7244 15.5754 13.3219 14.9912 13.6141L9.77246 16.2225C9.28686 16.4653 8.71507 16.4653 8.22949 16.2225L3.01172 13.6141C2.42741 13.322 2.0587 12.7244 2.05859 12.0712V5.92956C2.05863 5.27627 2.42744 4.67881 3.01172 4.38659L8.22949 1.77721ZM3.25781 12.0712C3.25792 12.2699 3.37107 12.452 3.54883 12.5409L8.40137 14.9667V8.73717C8.2861 8.70275 8.17192 8.66196 8.0625 8.60729L3.25781 6.20495V12.0712ZM9.94043 8.60729C9.83073 8.66212 9.71616 8.70271 9.60059 8.73717V14.9667L14.4541 12.5409C14.6319 12.452 14.744 12.2699 14.7441 12.0712V6.20495L9.94043 8.60729ZM9.23633 2.85046C9.08859 2.7766 8.91435 2.77664 8.7666 2.85046L4 5.23327L8.59863 7.53405C8.85174 7.66054 9.15015 7.66037 9.40332 7.53405L14.002 5.23327L9.23633 2.85046Z" fill="currentColor"></path></svg>Main Features</span></div><h2 class="mb-4.5 text-2xl font-medium -tracking-[1.5px] text-tg-title-color sm:text-3xl md:text-4xl lg:text-[40px]/[48px] max-w-[540px] w-full">Build faster with a complete React UI component library</h2><div class="text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base md:text-lg *:[&>strong]:font-medium *:[&>strong]:text-tg-title-color"><p>600+ free and pro React UI components, production-ready blocks, templates, and a complete design system built for teams who design, build, and ship at scale.</p></div></div></div><div class="relative bg-gray-100 p-5 sm:p-10"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="grid grid-cols-6 gap-2"><div class="col-span-6 lg:col-span-3"><div class="flex h-full justify-between gap-6 rounded-2xl bg-white p-2.5 pb-7 flex-col-reverse"><div><div class="relative flex items-center justify-center overflow-hidden rounded-20"><div style="opacity:0"><img alt="Feature Image 1" loading="lazy" width="1246" height="796" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-1-1.02qna1.r4gm_6.png&w=1920&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-1-1.02qna1.r4gm_6.png&w=3840&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-1-1.02qna1.r4gm_6.png&w=3840&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div></div><div class="relative mt-7 flex flex-wrap justify-center gap-2"><span class="absolute overflow-hidden rounded-full transition-all duration-300 ease-out" style="left:0;top:0;width:0;height:0"><span class="animate-border-travel absolute inset-0 rounded-full"></span><span class="absolute inset-px rounded-full bg-gray-50 shadow-template-tab"></span></span><button class="relative h-10 cursor-pointer rounded-full px-4 text-sm font-medium transition-colors duration-300 text-tg-text-color"><span class="relative z-10">Applications</span></button><button class="relative h-10 cursor-pointer rounded-full px-4 text-sm font-medium transition-colors duration-300 text-tg-text-color-secondary hover:text-tg-text-color"><span class="relative z-10">Marketing</span></button><button class="relative h-10 cursor-pointer rounded-full px-4 text-sm font-medium transition-colors duration-300 text-tg-text-color-secondary hover:text-tg-text-color"><span class="relative z-10">E-commerce</span></button><button class="relative h-10 cursor-pointer rounded-full px-4 text-sm font-medium transition-colors duration-300 text-tg-text-color-secondary hover:text-tg-text-color"><span class="relative z-10">Dashboards</span></button><button class="relative h-10 cursor-pointer rounded-full px-4 text-sm font-medium transition-colors duration-300 text-tg-text-color-secondary hover:text-tg-text-color"><span class="relative z-10">AI</span></button></div></div><div class="flex justify-between gap-2 px-4.5 pt-4.5"><div><h3 class="mb-2 text-lg font-medium sm:text-xl">600+ UI Blocks and Components</h3><p class="text-sm text-tg-text-color-secondary xs:text-base">Build faster with 600+ reusable React and Tailwind CSS UI blocks for applications, dashboards, marketing sites, eCommerce, and AI products.</p></div><div><a class="group flex size-10 items-center justify-center rounded-full border border-gray-200 text-tg-text-color-secondary hover:bg-gray-800 hover:text-white md:size-15" href="/blocks"><span class="relative flex h-6 w-6 items-center justify-center overflow-hidden"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="text-primary absolute top-1/2 left-1/2 size-4.5 -translate-x-1/2 -translate-y-1/2 transition-all duration-300 ease-in-out group-hover:translate-x-5 group-hover:opacity-0 md:size-6">
1<path d="M21.117 11.363l.061.068a.897.897 0 01.158.291l.004.013a.895.895 0 01.032.141v.007a.898.898 0 01-.287.784l-6.323 6.328a.9.9 0 01-1.274-1.272l4.817-4.821H3.515a.901.901 0 010-1.8l14.797-.001-4.827-4.83a.9.9 0 011.273-1.27l6.359 6.362z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="text-primary absolute top-1/2 left-1/2 size-4.5 -translate-x-[calc(50%+1.25rem)] -translate-y-1/2 opacity-0 transition-all duration-300 ease-in-out group-hover:-translate-x-1/2 group-hover:opacity-100 md:size-6"><path d="M21.117 11.363l.061.068a.897.897 0 01.158.291l.004.013a.895.895 0 01.032.141v.007a.898.898 0 01-.287.784l-6.323 6.328a.9.9 0 01-1.274-1.272l4.817-4.821H3.515a.901.901 0 010-1.8l14.797-.001-4.827-4.83a.9.9 0 011.273-1.27l6.359 6.362z" fill="currentColor"></path></svg></span></a></div></div></div></div><div class="col-span-6 lg:col-span-3"><div class="flex h-full flex-col justify-between gap-6 rounded-2xl bg-white p-2.5 pb-7"><div><div class="relative flex items-center justify-center overflow-hidden rounded-20"><div style="opacity:0"><img alt="Ready-to-Launch Templates" loading="lazy" width="1246" height="924" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-2.12364.k2h4epw.png&w=1920&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-2.12364.k2h4epw.png&w=3840&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-2.12364.k2h4epw.png&w=3840&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div></div></div><div class="flex justify-between gap-2 px-4.5 pt-4.5"><div><h3 class="mb-2 text-lg font-medium sm:text-xl">Ready-to-Launch Templates</h3><p class="text-sm text-tg-text-color-secondary xs:text-base">Production-ready React and Tailwind CSS templates built for real product flows, helping teams launch faster at scale.</p></div><div><a class="group flex size-10 items-center justify-center rounded-full border border-gray-200 text-tg-text-color-secondary hover:bg-gray-800 hover:text-white md:size-15" href="/templates"><span class="relative flex h-6 w-6 items-center justify-center overflow-hidden"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="text-primary absolute top-1/2 left-1/2 size-4.5 -translate-x-1/2 -translate-y-1/2 transition-all duration-300 ease-in-out group-hover:translate-x-5 group-hover:opacity-0 md:size-6"><path d="M21.117 11.363l.061.068a.897.897 0 01.158.291l.004.013a.895.895 0 01.032.141v.007a.898.898 0 01-.287.784l-6.323 6.328a.9.9 0 01-1.274-1.272l4.817-4.821H3.515a.901.901 0 010-1.8l14.797-.001-4.827-4.83a.9.9 0 011.273-1.27l6.359 6.362z" fill="currentColor"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" class="text-primary absolute top-1/2 left-1/2 size-4.5 -translate-x-[calc(50%+1.25rem)] -translate-y-1/2 opacity-0 transition-all duration-300 ease-in-out group-hover:-translate-x-1/2 group-hover:opacity-100 md:size-6"><path d="M21.117 11.363l.061.068a.897.897 0 01.158.291l.004.013a.895.895 0 01.032.141v.007a.898.898 0 01-.287.784l-6.323 6.328a.9.9 0 01-1.274-1.272l4.817-4.821H3.515a.901.901 0 010-1.8l14.797-.001-4.827-4.83a.9.9 0 011.273-1.27l6.359 6.362z" fill="currentColor"></path></svg></span></a></div></div></div></div><div class="col-span-6 md:col-span-3 lg:col-span-2"><a target="_blank" href="/figma" class="block cursor-pointer rounded-2xl border border-transparent bg-white p-2.5 transition hover:border-tg-border-1 hover:bg-gray-50"><div class="mb-1.5 flex aspect-video items-center justify-center rounded-lg bg-white"><img alt="Figma Design System" loading="lazy" width="813" height="520" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-3.0t4raqojc8~jl.png&w=828&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-3.0t4raqojc8~jl.png&w=1920&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-3.0t4raqojc8~jl.png&w=1920&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-4.5"><h3 class="mb-2 text-lg font-medium sm:text-xl">Figma Design System</h3><p class="line-clamp-2 text-sm text-tg-text-color-secondary xs:text-base">900+ Figma components with tokens and variants for precise, scalable design-to-development workflows.</p></div></a></div><div class="col-span-6 md:col-span-3 lg:col-span-2"><a target="_blank" href="https://tailgrids.com/docs/components" class="block cursor-pointer rounded-2xl border border-transparent bg-white p-2.5 transition hover:border-tg-border-1 hover:bg-gray-50"><div class="mb-1.5 flex aspect-video items-center justify-center rounded-lg bg-white"><img alt="100+ Free UI Components" loading="lazy" width="813" height="520" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-4.17ii7pp534vm6.png&w=828&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-4.17ii7pp534vm6.png&w=1920&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-4.17ii7pp534vm6.png&w=1920&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-4.5"><h3 class="mb-2 text-lg font-medium sm:text-xl">100+ Free UI Components</h3><p class="line-clamp-2 text-sm text-tg-text-color-secondary xs:text-base">Open-source React and Tailwind components for fast, consistent UI development.</p></div></a></div><div class="col-span-6 md:col-span-3 lg:col-span-2"><a target="_blank" href="https://tailgrids.com/docs/installation#pick-your-framework" class="block cursor-pointer rounded-2xl border border-transparent bg-white p-2.5 transition hover:border-tg-border-1 hover:bg-gray-50"><div class="mb-1.5 flex aspect-video items-center justify-center rounded-lg bg-white"><img alt="Use with every React framework" loading="lazy" width="1221" height="780" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-5.11m7ej4sp.iv3.png&w=1920&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-5.11m7ej4sp.iv3.png&w=3840&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage-5.11m7ej4sp.iv3.png&w=3840&q=100&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-4.5"><h3 class="mb-2 text-lg font-medium sm:text-xl">Use with every React framework</h3><p class="line-clamp-2 text-sm text-tg-text-color-secondary xs:text-base">Scalable design system enabling flexible, framework-agnostic UI development.</p></div></a></div></div></div><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
1<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div></div></section><section class="mt-20 overflow-hidden bg-gray-950"><div class="relative mx-auto w-full max-w-[1456px]"><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-gray-950 [--pattern-fg:var(--border-2)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)] -mt-px"></div><div class="p-5 pt-10 sm:p-10 sm:pt-20"><div class="w-full max-w-[800px]"><div class="mb-4"><span class="inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium bg-gray-800 text-gray-400" style="box-shadow:0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.375 9.52539C7.53479 9.52539 8.4746 10.4652 8.47461 11.625V13.5C8.4746 14.6598 7.53479 15.5996 6.375 15.5996H4.5C3.34021 15.5996 2.4004 14.6598 2.40039 13.5V11.625C2.4004 10.4652 3.34021 9.52539 4.5 9.52539H6.375ZM13.5 9.52539C14.6598 9.52539 15.5996 10.4652 15.5996 11.625V13.5C15.5996 14.6598 14.6598 15.5996 13.5 15.5996H11.625C10.4652 15.5996 9.5254 14.6598 9.52539 13.5V11.625C9.5254 10.4652 10.4652 9.52539 11.625 9.52539H13.5ZM4.5 10.7246C4.00295 10.7246 3.59962 11.128 3.59961 11.625V13.5C3.59962 13.997 4.00295 14.4004 4.5 14.4004H6.375C6.87205 14.4004 7.27538 13.997 7.27539 13.5V11.625C7.27538 11.128 6.87205 10.7246 6.375 10.7246H4.5ZM11.625 10.7246C11.128 10.7246 10.7246 11.128 10.7246 11.625V13.5C10.7246 13.997 11.1279 14.4004 11.625 14.4004H13.5C13.9971 14.4004 14.4004 13.997 14.4004 13.5V11.625C14.4004 11.128 13.997 10.7246 13.5 10.7246H11.625ZM6.375 2.40039C7.5348 2.40039 8.47461 3.3402 8.47461 4.5V6.375C8.4746 7.53479 7.53479 8.47461 6.375 8.47461H4.5C3.34021 8.47461 2.4004 7.53479 2.40039 6.375V4.5C2.40039 3.3402 3.3402 2.40039 4.5 2.40039H6.375ZM13.5 2.40039C14.6598 2.40039 15.5996 3.3402 15.5996 4.5V6.375C15.5996 7.53479 14.6598 8.47461 13.5 8.47461H11.625C10.4652 8.47461 9.5254 7.53479 9.52539 6.375V4.5C9.52539 3.3402 10.4652 2.40039 11.625 2.40039H13.5ZM4.5 3.59961C4.00294 3.59961 3.59961 4.00294 3.59961 4.5V6.375C3.59962 6.87205 4.00295 7.27539 4.5 7.27539H6.375C6.87205 7.27539 7.27538 6.87205 7.27539 6.375V4.5C7.27539 4.00294 6.87206 3.59961 6.375 3.59961H4.5ZM11.625 3.59961C11.1279 3.59961 10.7246 4.00294 10.7246 4.5V6.375C10.7246 6.87205 11.1279 7.27539 11.625 7.27539H13.5C13.9971 7.27539 14.4004 6.87205 14.4004 6.375V4.5C14.4004 4.00294 13.9971 3.59961 13.5 3.59961H11.625Z" fill="currentColor"></path></svg>Core Features</span></div><h2 class="mb-4.5 text-2xl font-medium -tracking-[1.5px] sm:text-3xl md:text-4xl lg:text-[40px]/[48px] text-white max-w-[550px] w-full">Build faster with a complete React + Tailwind UI library</h2><div class="text-sm -tracking-[.2px] xs:text-base md:text-lg *:[&>strong]:font-medium text-gray-400 *:[&>strong]:text-gray-300"><p>600+ free and pro React UI components, production-ready blocks, templates, and a complete design system built for teams who design, build, and ship at scale.</p></div></div></div><div class="relative bg-gray-950 p-5 sm:p-10"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-2)]"></div><div class="columns-1 gap-2 md:columns-2 xl:columns-3"><div class="relative"><div class="box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse"><div class="flex items-center justify-center"><img alt="600+ UI Building Blocks and Components" loading="lazy" width="854" height="440" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-1.0djlf1_7v.r9t.png&w=1080&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-1.0djlf1_7v.r9t.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-1.0djlf1_7v.r9t.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-5 xs:p-8"><h3 class="mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg">600+ UI Building Blocks and Components</h3><p class="text-sm text-gray-400 xs:text-base">Production-ready, framework-agnostic UI building blocks, components, layouts, and scalable interface patterns for modern applications.</p></div></div></div><div class="relative"><div class="box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse"><div class="flex items-center justify-center"><img alt="Styled with Tailwind CSS" loading="lazy" width="854" height="512" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-2.0-tjbox8gthse.png&w=1080&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-2.0-tjbox8gthse.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-2.0-tjbox8gthse.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-5 xs:p-8"><h3 class="mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg">Styled with Tailwind CSS</h3><p class="text-sm text-gray-400 xs:text-base">Built with the latest Tailwind CSS for utility-first styling, theming, rapid iteration, and scalable UI development.</p></div></div></div><div class="relative"><div class="box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse"><div class="flex items-center justify-center"><img alt="Light and Dark Theme Support" loading="lazy" width="854" height="480" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-3.0x.fq7susy25p.png&w=1080&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-3.0x.fq7susy25p.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-3.0x.fq7susy25p.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-5 xs:p-8"><h3 class="mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg">Light and Dark Theme Support</h3><p class="text-sm text-gray-400 xs:text-base">Built-in light and dark themes across all components, aligned with system preferences and consistent UI behavior.</p></div></div></div><div class="relative"><div class="box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse"><div class="flex items-center justify-center"><img alt="Developer Friendly" loading="lazy" width="854" height="520" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-4.14lenet45-.6u.png&w=1080&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-4.14lenet45-.6u.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-4.14lenet45-.6u.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-5 xs:p-8"><h3 class="mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg">Developer Friendly</h3><p class="text-sm text-gray-400 xs:text-base">Built for DX with CLI tooling, consistent component structures, and predictable patterns that scale from development to production.</p></div></div></div><div class="relative"><div class="box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse"><div class="flex items-center justify-center"><img alt="Easy to Use" loading="lazy" width="854" height="480" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-5.0c.2t.ly0bxrg.png&w=1080&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-5.0c.2t.ly0bxrg.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-5.0c.2t.ly0bxrg.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-5 xs:p-8"><h3 class="mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg">Easy to Use</h3><p class="text-sm text-gray-400 xs:text-base">Integrate a production-ready UI component library with predictable structure and minimal configuration. Copy components directly into existing or new Tailwind projects with confidence.</p></div></div></div><div class="relative"><div class="box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse"><div class="flex items-center justify-center"><img alt="Figma Design System" loading="lazy" width="852" height="428" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-6.10whx_mhluqc0.png&w=1080&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-6.10whx_mhluqc0.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-6.10whx_mhluqc0.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-5 xs:p-8"><h3 class="mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg">Figma Design System</h3><p class="text-sm text-gray-400 xs:text-base">Own the complete Figma design system with components, tokens, and seamless design-to-development workflows.</p></div></div></div><div class="relative"><div class="box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse"><div class="flex items-center justify-center"><img alt="CLI Tool Support" loading="lazy" width="854" height="440" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-7.0zji8353d9y4g.png&w=1080&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-7.0zji8353d9y4g.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-7.0zji8353d9y4g.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-5 xs:p-8"><h3 class="mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg">CLI Tool Support</h3><p class="text-sm text-gray-400 xs:text-base">Use the Tailgrids CLI to scaffold projects, add components, and standardize workflows across teams and codebase
1s.</p></div></div></div><div class="relative"><div class="box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse"><div class="flex items-center justify-center"><img alt="Refreshing Design" loading="lazy" width="854" height="522" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-8.06ofd-g7bfhtx.png&w=1080&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-8.06ofd-g7bfhtx.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-8.06ofd-g7bfhtx.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-5 xs:p-8"><h3 class="mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg">Refreshing Design</h3><p class="text-sm text-gray-400 xs:text-base">Clean, high-quality UI aligned with modern design standards, delivering visual clarity, strong hierarchy, and polished experiences across products.</p></div></div></div><div class="relative"><div class="box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse"><div class="flex items-center justify-center"><img alt="Fully Responsive" loading="lazy" width="852" height="422" decoding="async" data-nimg="1" class="rounded-lg object-cover" style="color:transparent" srcSet="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-9.0g8mvinv7oozs.png&w=1080&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-9.0g8mvinv7oozs.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcore-feature-9.0g8mvinv7oozs.png&w=1920&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="p-5 xs:p-8"><h3 class="mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg">Fully Responsive</h3><p class="text-sm text-gray-400 xs:text-base">Designed to adapt across screen sizes and modern browsers, with components tested to ensure consistent layout and behavior on all devices.</p></div></div></div></div></div><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)] -mb-px"></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
1<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div></div></section><section class="mt-15 overflow-hidden"><div class="relative mx-auto w-full max-w-[1456px]"><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="grid *:border-tg-border-1 *:last-of-type:border-0 max-lg:*:border-b lg:grid-cols-2 lg:*:border-r"><div class="@container/stats-card"><div class="animate-pulse p-2"><div class="flex gap-8 rounded-xl p-6 @md/stats-card:px-10 @md/stats-card:py-9"><div class="size-16 rounded-[18px] bg-gray-200"></div><div class="flex-1"><div class="h-12 w-24 rounded bg-gray-200"></div><div class="mt-2 h-5 w-32 rounded bg-gray-200"></div></div></div></div></div><div class="@container/stats-card"><div class="animate-pulse p-2"><div class="flex gap-8 rounded-xl p-6 @md/stats-card:px-10 @md/stats-card:py-9"><div class="size-16 rounded-[18px] bg-gray-200"></div><div class="flex-1"><div class="h-12 w-24 rounded bg-gray-200"></div><div class="mt-2 h-5 w-32 rounded bg-gray-200"></div></div></div></div></div><div class="@container/stats-card"><div class="animate-pulse p-2"><div class="flex gap-8 rounded-xl p-6 @md/stats-card:px-10 @md/stats-card:py-9"><div class="size-16 rounded-[18px] bg-gray-200"></div><div class="flex-1"><div class="h-12 w-24 rounded bg-gray-200"></div><div class="mt-2 h-5 w-32 rounded bg-gray-200"></div></div></div></div></div></div><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
1<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div></div></section><section class="mt-20 overflow-hidden"><div class="relative mx-auto w-full max-w-[1456px]"><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="p-5 pt-10 sm:p-10 sm:pt-20"><div class="w-full max-w-[800px]"><div class="mb-4"><span class="inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium text-tg-text-color-secondary" style="box-shadow:0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.71764 3.78214L8.46964 2.03014C8.61028 1.88953 8.80101 1.81055 8.99989 1.81055C9.19876 1.81055 9.38949 1.88953 9.53014 2.03014L11.2821 3.78214C11.4227 3.92278 11.5017 4.11351 11.5017 4.31239C11.5017 4.51126 11.4227 4.70199 11.2821 4.84264L9.53014 6.59464C9.38949 6.73524 9.19876 6.81423 8.99989 6.81423C8.80101 6.81423 8.61028 6.73524 8.46964 6.59464L6.71764 4.84264C6.57703 4.70199 6.49805 4.51126 6.49805 4.31239C6.49805 4.11351 6.57703 3.92278 6.71764 3.78214ZM6.71764 13.1571L8.46964 11.4051C8.61028 11.2645 8.80101 11.1855 8.99989 11.1855C9.19876 11.1855 9.38949 11.2645 9.53014 11.4051L11.2821 13.1571C11.4227 13.2978 11.5017 13.4885 11.5017 13.6874C11.5017 13.8863 11.4227 14.077 11.2821 14.2176L9.53014 15.9696C9.38949 16.1102 9.19876 16.1892 8.99989 16.1892C8.80101 16.1892 8.61028 16.1102 8.46964 15.9696L6.71764 14.2176C6.57703 14.077 6.49805 13.8863 6.49805 13.6874C6.49805 13.4885 6.57703 13.2978 6.71764 13.1571ZM2.03014 8.46964L3.78214 6.71764C3.92278 6.57703 4.11351 6.49805 4.31239 6.49805C4.51126 6.49805 4.70199 6.57703 4.84264 6.71764L6.59464 8.46964C6.73524 8.61028 6.81423 8.80101 6.81423 8.99989C6.81423 9.19876 6.73524 9.38949 6.59464 9.53014L4.84264 11.2821C4.70199 11.4227 4.51126 11.5017 4.31239 11.5017C4.11351 11.5017 3.92278 11.4227 3.78214 11.2821L2.03014 9.53014C1.88953 9.38949 1.81055 9.19876 1.81055 8.99989C1.81055 8.80101 1.88953 8.61028 2.03014 8.46964ZM11.4051 8.46964L13.1571 6.71764C13.2978 6.57703 13.4885 6.49805 13.6874 6.49805C13.8863 6.49805 14.077 6.57703 14.2176 6.71764L15.9696 8.46964C16.1102 8.61028 16.1892 8.80101 16.1892 8.99989C16.1892 9.19876 16.1102 9.38949 15.9696 9.53014L14.2176 11.2821C14.077 11.4227 13.8863 11.5017 13.6874 11.5017C13.4885 11.5017 13.2978 11.4227 13.1571 11.2821L11.4051 9.53014C11.2645 9.38949 11.1855 9.19876 11.1855 8.99989C11.1855 8.80101 11.2645 8.61028 11.4051 8.46964Z" stroke="currentColor" stroke-width="1.3" stroke-linejoin="round"></path></svg>Components</span></div><h2 class="mb-4.5 text-2xl font-medium -tracking-[1.5px] text-tg-title-color sm:text-3xl md:text-4xl lg:text-[40px]/[48px] max-w-[600px] w-full">600+ UI Components and Blocks to Build Faster</h2><div class="text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base md:text-lg *:[&>strong]:font-medium *:[&>strong]:text-tg-title-color"><p>Each component and block ships with a full Figma source and production-ready code, ensuring consistent design-to-development workflows at scale.</p></div></div></div><div class="relative bg-gray-100 p-5 sm:p-10"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="relative pb-25"><div class="grid gap-5 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 xl:gap-9.5"><a class="overflow-hidden rounded-2xl border border-tg-border-1 bg-white transition-all duration-200 cursor-pointer" href="/blocks/blog-sections"><div class="relative w-full"><img alt="Blog Sections" loading="lazy" width="294" height="235" decoding="async" data-nimg="1" class="aspect-294/235 w-full min-w-0 object-cover" style="color:transparent" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768298214335-blog-grid.png&w=384&q=75 1x, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768298214335-blog-grid.png&w=640&q=75 2x" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768298214335-blog-grid.png&w=640&q=75"/></div><div class="border-t border-tg-border-1 px-5 py-4 sm:px-5 sm:py-4"><h3 class="text-md sm:text-md leading-5 font-medium tracking-[-0.2px] text-gray-700 sm:leading-6">Blog Sections</h3><p class="text-sm leading-4 tracking-[-0.2px] text-gray-500 sm:text-sm sm:leading-5">12 Components</p></div></a><a class="overflow-hidden rounded-2xl border border-tg-border-1 bg-white transition-all duration-200 cursor-pointer" href="/blocks/blog-details"><div class="relative w-full"><img alt="Blog Details" loading="lazy" width="294" height="235" decoding="async" data-nimg="1" class="aspect-294/235 w-full min-w-0 object-cover" style="color:transparent" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768361556140-blog-details.png&w=384&q=75 1x, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768361556140-blog-details.png&w=640&q=75 2x" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768361556140-blog-details.png&w=640&q=75"/></div><div class="border-t border-tg-border-1 px-5 py-4 sm:px-5 sm:py-4"><h3 class="text-md sm:text-md leading-5 font-medium tracking-[-0.2px] text-gray-700 sm:leading-6">Blog Details</h3><p class="text-sm leading-4 tracking-[-0.2px] text-gray-500 sm:text-sm sm:leading-5">4 Components</p></div></a><a class="overflow-hidden rounded-2xl border border-tg-border-1 bg-white transition-all duration-200 cursor-pointer" href="/blocks/bento-grids"><div class="relative w-full"><img alt="Bento Grids" loading="lazy" width="294" height="235" decoding="async" data-nimg="1" class="aspect-294/235 w-full min-w-0 object-cover" style="color:transparent" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768362791453-bento-grids.png&w=384&q=75 1x, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768362791453-bento-grids.png&w=640&q=75 2x" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768362791453-bento-grids.png&w=640&q=75"/></div><div class="border-t border-tg-border-1 px-5 py-4 sm:px-5 sm:py-4"><h3 class="text-md sm:text-md leading-5 font-medium tracking-[-0.2px] text-gray-700 sm:leading-6">Bento Grids</h3><p class="text-sm leading-4 tracking-[-0.2px] text-gray-500 sm:text-sm sm:leading-5">4 Components</p></div></a><a class="overflow-hidden rounded-2xl border border-tg-border-1 bg-white transition-all duration-200 cursor-pointer" href="/blocks/cards"><div class="relative w-full"><img alt="Cards" loading="lazy" width="294" height="235" decoding="async" data-nimg="1" class="aspect-294/235 w-full min-w-0 object-cover" style="color:transparent" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768363047718-cards.png&w=384&q=75 1x, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768363047718-cards.png&w=640&q=75 2x" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768363047718-cards.png&w=640&q=75"/></div><div class="border-t border-tg-border-1 px-5 py-4 sm:px-5 sm:py-4"><h3 class="text-md sm:text-md leading-5 font-medium tracking-[-0.2px] text-gray-700 sm:leading-6">Cards</h3><p class="text-sm leading-4 tracking-[-0.2px] text-gray-500 sm:text-sm sm:leading-5">13 Components</p></div></a><a class="overflow-hidden rounded-2xl border border-tg-border-1 bg-white transition-all duration-200 cursor-pointer" href="/blocks/contact"><div class="relative w-full"><img alt="Contact" loading="lazy" width="294" height="235" decoding="async" data-nimg="1" class="aspect-294/235 w-full min-w-0 object-cover" style="color:transparent" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768363296386-contact.png&w=384&q=75 1x, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768363296386-contact.png&w=640&q=75 2x" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768363296386-contact.png&w=640&q=75"/></div><div class="border-t border-tg-border-1 px-5 py-4 sm:px-5 sm:py-4"><h3 class="text-md sm:text-md leading-5 font-medium tracking-[-0.2px] text-gray-700 sm:leading-6">Contact</h3><p class="text-sm leading-4 tracking-[-0.2px] text-gray-500 sm:text-sm sm:leading-5">7 Components</p></div></a><a class="overflow-hidden rounded-2xl border border-tg-border-1 bg-white transition-all duration-200 cursor-pointer" href="/blocks/cookies"><div class="relative w-full"><img alt="Cookies" loading="lazy" width="294" height="235" decoding="async" data-nimg="1" class="aspect-294/235 w-full min-w-0 object-cover" style="color:transparent" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768372875987-cookies.png&w=384&q=75 1x, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768372875987-cookies.png&w=640&q=75 2x" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768372875987-cookies.png&w=640&q=75"/></div><div class="border-t border-tg-border-1 px-5 py-4 sm:px-5 sm:py-4"><h3 class="text-md sm:text-md leading-5 font-medium tracking-[-0.2px] text-gray-700 sm:leading-6">Cookies</h3><p class="text-sm leading-4 tracking-[-0.2px] text-gray-500 sm:text-sm sm:leading-5">5 Components</p></div></a><a class="overflow-hidden rounded-2xl border border-tg-border-1 bg-white transition-all duration-200 cursor-pointer" href="/blocks/error-page"><div class="relative w-full"><img alt="Error Page" loading="lazy" width="294" height="235" decoding="async" data-nimg="1" class="aspect-294/235 w-full min-w-0 object-cover" style="color:transparent" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768373598425-error-page.png&w=384&q=75 1x, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768373598425-error-page.png&w=640&q=75 2x" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768373598425-error-page.png&w=640&q=75"/></div><div class="border-t border-tg-border-1 px-5 py-4 sm:px-5 sm:py-4"><h3 class="text-md sm:text-md leading-5 font-medium tracking-[-0.2px] text-gray-700 sm:leading-6">Error Page</h3><p class="text-sm leading-4 tracking-[-0.2px] text-gray-500 sm:text-sm sm:leading-5">5 Components</p></div></a><a class="overflow-hidden rounded-2xl border border-tg-border-1 bg-white transition-all duration-200 cursor-pointer" href="/blocks/mega-menu"><div class="relative w-full"><img alt="Mega Menu" loading="lazy" width="294" height="235" decoding="async" data-nimg="1" class="aspect-294/235 w-full min-w-0 object-cover" style="color:transparent" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768381015239-mega-menu.png&w=384&q=75 1x, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768381015239-mega-menu.png&w=640&q=75 2x" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1768381015239-mega-menu.png&w=640&q=75"/></div><div class="border-t border-tg-border-1 px-5 py-4 sm:px-5 sm:py-4"><h3 class="text-md sm:text-md leading-5 font-medium tracking-[-0.2px] text-gray-700 sm:leading-6">Mega Menu</h3><p class="text-sm leading-4 tracking-[-0.2px] text-gray-500 sm:text-sm sm:leading-5">4 Components</p></div></a></div><div class="absolute inset-x-0 bottom-0 flex h-[250px] items-end justify-center bg-[linear-gradient(0deg,#F3F4F6_36.2%,rgba(243,244,246,0.00)_100%)] pb-2.5"><div class="flex items-center justify-center gap-3 max-sm:flex-col"><a target="_blank" href="https://www.figma.com/design/X810dnBppzPzWD6OGxq31Q/TailGrids-v3.5---Live-Preview?node-id=1112-920&t=7mWGaMQKe5p4Lslb-1" class="inline-flex h-11 cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm font-medium duration-200 focus-visible:outline-none disabled:pointer-events-none bg-white hover:bg-gray-50 text-tg-title-color shadow-default-button" aria-disabled="false" aria-busy="false">
1<svg class="size-6" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M10 10C10 9.33696 10.2634 8.70107 10.7322 8.23223C11.2011 7.76339 11.837 7.5 12.5 7.5C13.163 7.5 13.7989 7.76339 14.2678 8.23223C14.7366 8.70107 15 9.33696 15 10C15 10.663 14.7366 11.2989 14.2678 11.7678C13.7989 12.2366 13.163 12.5 12.5 12.5C11.837 12.5 11.2011 12.2366 10.7322 11.7678C10.2634 11.2989 10 10.663 10 10Z" fill="#1ABCFE"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5 15C5 14.337 5.26339 13.7011 5.73223 13.2322C6.20107 12.7634 6.83696 12.5 7.5 12.5H10V15C10 15.663 9.73661 16.2989 9.26777 16.7678C8.79893 17.2366 8.16304 17.5 7.5 17.5C6.83696 17.5 6.20107 17.2366 5.73223 16.7678C5.26339 16.2989 5 15.663 5 15Z" fill="#0ACF83"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M10 2.5V7.5H12.5C13.163 7.5 13.7989 7.23661 14.2678 6.76777C14.7366 6.29893 15 5.66304 15 5C15 4.33696 14.7366 3.70107 14.2678 3.23223C13.7989 2.76339 13.163 2.5 12.5 2.5H10Z" fill="#FF7262"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5 5C5 5.66304 5.26339 6.29893 5.73223 6.76777C6.20107 7.23661 6.83696 7.5 7.5 7.5H10V2.5H7.5C6.83696 2.5 6.20107 2.76339 5.73223 3.23223C5.26339 3.70107 5 4.33696 5 5Z" fill="#F24E1E"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5 10C5 10.663 5.26339 11.2989 5.73223 11.7678C6.20107 12.2366 6.83696 12.5 7.5 12.5H10V7.5H7.5C6.83696 7.5 6.20107 7.76339 5.73223 8.23223C5.26339 8.70107 5 9.33696 5 10Z" fill="#A259FF"></path></svg><span>Preview<!-- --> <span class="text-tg-text-color-secondary"> <!-- -->- Figma<!-- --> </span> </span><svg class="size-6" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.91732 14.1667L12.084 10L7.91732 5.83335" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"></path></svg></a><a class="inline-flex h-11 cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm font-medium duration-200 focus-visible:outline-none disabled:pointer-events-none bg-gray-800 hover:bg-gray-900 text-white shadow-secondary-button" aria-disabled="false" aria-busy="false" href="/blocks"><span>Browse All<!-- --> <span class="text-white/70"> - Blocks </span> </span><svg class="size-6" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.91732 14.1667L12.084 10L7.91732 5.83335" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"></path></svg></a></div></div></div></div><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
1<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div></div></section><section class="mt-20 overflow-hidden"><div class="relative mx-auto w-full max-w-[1456px]"><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="relative p-5 pt-10 sm:p-10 sm:pt-20"><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="w-full max-w-[800px]"><div class="mb-4"><span class="inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium text-tg-text-color-secondary" style="box-shadow:0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15 10.9995L3 10.9995M9 15V10.9999M3 4.125L3 13.875C3 14.4963 3.50368 15 4.125 15H13.875C14.4963 15 15 14.4963 15 13.875V4.125C15 3.50368 14.4963 3 13.875 3L4.125 3C3.50368 3 3 3.50368 3 4.125Z" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"></path></svg>Templates</span></div><h2 class="mb-4.5 text-2xl font-medium -tracking-[1.5px] text-tg-title-color sm:text-3xl md:text-4xl lg:text-[40px]/[48px] max-w-[550px] w-full">Beautifully Designed Templates for Real Projects</h2><div class="text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base md:text-lg *:[&>strong]:font-medium *:[&>strong]:text-tg-title-color"><p>Launch faster with ready-to-ship React templates and Figma source, built on Tailgrids UI components for real product workflows.</p></div></div></div><div class="relative overflow-hidden bg-gray-100"><div class="relative"><div class="relative flex flex-wrap items-center justify-between gap-5 p-5 lg:px-10"><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)] border-gray-200"></div><div class="relative flex w-full flex-1 items-center sm:w-auto sm:flex-none"><button class="absolute left-0 z-30 flex h-8 w-8 items-center justify-center rounded-full bg-white shadow-lg transition-all hover:bg-gray-50 hover:shadow-xl sm:hidden pointer-events-none opacity-0" aria-label="Scroll left"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M10 12L6 8l4-4" stroke="#666" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><div class="scrollbar-hide relative flex max-w-[320px] flex-1 items-center gap-1.5 overflow-x-auto px-1 py-1 sm:max-w-full" style="scrollbar-width:none;-ms-overflow-style:none"><div class="pointer-events-none absolute rounded-full bg-white shadow-[0_0_0_1px_rgba(41,41,41,0.08),0_1px_1px_0px_rgba(41,41,41,0.04),0_2px_2px_-1px_rgba(41,41,41,0.04),0_4px_4px_-2px_rgba(41,41,41,0.06),inset_0_-0.5px_0.5px_0px_rgba(41,41,41,0.08)] " style="left:0px;top:0px;width:0px;height:0px"></div><a class="relative z-10 shrink-0 cursor-pointer rounded-full px-3 py-2 text-xs leading-5 font-medium tracking-[-0.2px] whitespace-nowrap transition-colors duration-200 ease-in-out sm:px-4 sm:py-2.5 sm:text-sm text-gray-800" href="#">All Templates</a><a class="relative z-10 shrink-0 cursor-pointer rounded-full px-3 py-2 text-xs leading-5 font-medium tracking-[-0.2px] whitespace-nowrap transition-colors duration-200 ease-in-out sm:px-4 sm:py-2.5 sm:text-sm text-gray-700 hover:text-gray-900" href="#">Marketing </a><a class="relative z-10 shrink-0 cursor-pointer rounded-full px-3 py-2 text-xs leading-5 font-medium tracking-[-0.2px] whitespace-nowrap transition-colors duration-200 ease-in-out sm:px-4 sm:py-2.5 sm:text-sm text-gray-700 hover:text-gray-900" href="#">Dashboard </a><a class="relative z-10 shrink-0 cursor-pointer rounded-full px-3 py-2 text-xs leading-5 font-medium tracking-[-0.2px] whitespace-nowrap transition-colors duration-200 ease-in-out sm:px-4 sm:py-2.5 sm:text-sm text-gray-700 hover:text-gray-900" href="#">Ecommerce</a><a class="relative z-10 shrink-0 cursor-pointer rounded-full px-3 py-2 text-xs leading-5 font-medium tracking-[-0.2px] whitespace-nowrap transition-colors duration-200 ease-in-out sm:px-4 sm:py-2.5 sm:text-sm text-gray-700 hover:text-gray-900" href="#">Applications</a></div><button class="absolute right-0 z-30 flex h-8 w-8 items-center justify-center rounded-full bg-white shadow-lg transition-all hover:bg-gray-50 hover:shadow-xl sm:hidden pointer-events-none opacity-0" aria-label="Scroll right"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewB
1ox="0 0 16 16" fill="none"><path d="M6 12l4-4-4-4" stroke="#666" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></div><div class="hidden items-center gap-3"><button class="flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium transition-all bg-orange-50 text-orange-600"><svg class="h-4 w-4" viewBox="0 0 24 24" fill="currentColor"><path d="M12 17.56l-4.45 2.34.85-4.95-3.6-3.5 4.97-.72L12 6.2l2.23 4.53 4.97.72-3.6 3.5.85 4.95L12 17.56z"></path></svg>Html</button><button class="flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium transition-all text-gray-600 hover:text-gray-900"><svg class="h-4 w-4" viewBox="0 0 24 24" fill="currentColor"><path d="M12 10.11c1.03 0 1.87.84 1.87 1.87S13.03 13.85 12 13.85 10.13 13 10.13 12s.84-1.89 1.87-1.89M7.37 20c.63.38 2.01-.2 3.6-1.7-.52-.59-1.03-1.23-1.51-1.9-.82-.08-1.63-.2-2.4-.36-.51 2.14-.32 3.61.31 3.96m.71-5.74l-.29-.51c-.11.29-.22.58-.29.86.27.06.57.11.88.16l-.3-.51m6.54-.76l.81-1.5-.81-1.5c-.3-.53-.62-1-.91-1.47C13.17 9 12.6 9 12 9s-1.17 0-1.71.03c-.29.47-.61.94-.91 1.47L8.57 12l.81 1.5c.3.53.62 1 .91 1.47.54.03 1.11.03 1.71.03s1.17 0 1.71-.03c.29-.47.61-.94.91-1.47M12 6.78c-.19.22-.39.45-.59.72h1.18c-.2-.27-.4-.5-.59-.72m0 10.44c.19-.22.39-.45.59-.72h-1.18c.2.27.4.5.59.72M16.62 4c-.62-.38-2 .2-3.59 1.7.52.59 1.03 1.23 1.51 1.9.82.08 1.63.2 2.4.36.51-2.14.32-3.61-.32-3.96m-.7 5.74l.29.51c.11-.29.22-.58.29-.86-.27-.06-.57-.11-.88-.16l.3.51m1.45-7.05c1.47.84 1.63 3.05 1.01 5.63 2.54.75 4.37 1.99 4.37 3.68s-1.83 2.93-4.37 3.68c.62 2.58.46 4.79-1.01 5.63-1.46.84-3.45-.12-5.37-1.95-1.92 1.83-3.91 2.79-5.38 1.95-1.46-.84-1.62-3.05-1-5.63-2.54-.75-4.37-1.99-4.37-3.68s1.83-2.93 4.37-3.68c-.62-2.58-.46-4.79 1-5.63 1.47-.84 3.46.12 5.38 1.95 1.92-1.83 3.91-2.79 5.37-1.95M17.08 12c.34.75.64 1.5.89 2.26 2.1-.63 3.28-1.53 3.28-2.26s-1.18-1.63-3.28-2.26c-.25.76-.55 1.51-.89 2.26M6.92 12c-.34-.75-.64-1.5-.89-2.26-2.1.63-3.28 1.53-3.28 2.26s1.18 1.63 3.28 2.26c.25-.76.55-1.51.89-2.26m9 2.26l-.3.51c.31-.05.61-.1.88-.16-.07-.28-.18-.57-.29-.86l-.29.51m-2.89 4.04c1.59 1.5 2.97 2.08 3.59 1.7.64-.35.83-1.82.32-3.96-.77.16-1.58.28-2.4.36-.48.67-.99 1.31-1.51 1.9M8.08 9.74l.3-.51c-.31.05-.61.1-.88.16.07.28.18.57.29.86l.29-.51m2.89-4.04C9.38 4.2 8 3.62 7.37 4c-.63.35-.82 1.82-.31 3.96.77-.16 1.58-.28 2.4-.36.48-.67.99-1.31 1.51-1.9z"></path></svg>React</button></div></div><div class="p-5 pb-0! sm:p-10"><div class="grid gap-5 sm:grid-cols-2 lg:grid-cols-3 xl:gap-8"><a class="group relative isolate flex flex-col gap-6 overflow-hidden" href="/templates/nexstudio"><div class="relative overflow-hidden rounded-2xl bg-white p-7.5 pb-0"><div class="relative z-10 aspect-350/270 overflow-hidden rounded-t-xl shadow-[0_10.681px_32.574px_0_rgba(31,31,31,0.04)]"><img alt="NexStudio - React Agency Website Template" loading="lazy" decoding="async" data-nimg="fill" class="rounded-t-xl object-cover object-top transition-transform" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1786247018741-1768815243783-nexstudio-lg.webp&w=640&q=75 640w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1786247018741-1768815243783-nexstudio-lg.webp&w=750&q=75 750w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1786247018741-1768815243783-nexstudio-lg.webp&w=828&q=75 828w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1786247018741-1768815243783-nexstudio-lg.webp&w=1080&q=75 1080w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1786247018741-1768815243783-nexstudio-lg.webp&w=1200&q=75 1200w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1786247018741-1768815243783-nexstudio-lg.webp&w=1920&q=75 1920w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1786247018741-1768815243783-nexstudio-lg.webp&w=2048&q=75 2048w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1786247018741-1768815243783-nexstudio-lg.webp&w=3840&q=75 3840w" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1786247018741-1768815243783-nexstudio-lg.webp&w=3840&q=75"/></div><div class="absolute bottom-0 left-0">
1<svg width="408" height="297" viewBox="0 0 408 297" fill="none" xmlns="http://www.w3.org/2000/svg"><g filter="url(#filter0_f_13449_4607)"><rect x="40.3008" y="188.635" width="172.482" height="172.482" rx="86.2412" fill="#3758F9"></rect></g><defs><filter id="filter0_f_13449_4607" x="-259.699" y="-111.365" width="772.482" height="772.482" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="150" result="effect1_foregroundBlur_13449_4607"></feGaussianBlur></filter></defs></svg></div></div><div><h3 class="line-clamp-1 text-xl font-medium -tracking-[.5px] text-tg-text-color">NexStudio - React Agency Website Template</h3><p class="mt-1 line-clamp-1 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base">React agency website template for digital studios and product teams. Includes services, projects, testimonials, and blog pages. Built with Tailwind CSS.</p></div></a><a class="group relative isolate flex flex-col gap-6 overflow-hidden" href="/templates/fincash"><div class="relative overflow-hidden rounded-2xl bg-white p-7.5 pb-0"><div class="relative z-10 aspect-350/270 overflow-hidden rounded-t-xl shadow-[0_10.681px_32.574px_0_rgba(31,31,31,0.04)]"><img alt="Fincash - React Fintech Website Templates for Finance Apps" loading="lazy" decoding="async" data-nimg="fill" class="rounded-t-xl object-cover object-top transition-transform" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1769589368473-fincash-lg.png&w=640&q=75 640w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1769589368473-fincash-lg.png&w=750&q=75 750w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1769589368473-fincash-lg.png&w=828&q=75 828w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1769589368473-fincash-lg.png&w=1080&q=75 1080w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1769589368473-fincash-lg.png&w=1200&q=75 1200w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1769589368473-fincash-lg.png&w=1920&q=75 1920w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1769589368473-fincash-lg.png&w=2048&q=75 2048w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1769589368473-fincash-lg.png&w=3840&q=75 3840w" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1769589368473-fincash-lg.png&w=3840&q=75"/></div><div class="absolute bottom-0 left-0"><svg width="408" height="297" viewBox="0 0 408 297" fill="none" xmlns="http://www.w3.org/2000/svg"><g filter="url(#filter0_f_13449_4607)"><rect x="40.3008" y="188.635" width="172.482" height="172.482" rx="86.2412" fill="#3758F9"></rect></g><defs><filter id="filter0_f_13449_4607" x="-259.699" y="-111.365" width="772.482" height="772.482" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="150" result="effect1_foregroundBlur_13449_4607"></feGaussianBlur></filter></defs></svg></div></div><div><h3 class="line-clamp-1 text-xl font-medium -tracking-[.5px] text-tg-text-color">Fincash - React Fintech Website Templates for Finance Apps</h3><p class="mt-1 line-clamp-1 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base">Finance website template built with React for fintech apps. Includes features, pricing, testimonials, Contact and FAQs. Designed for payments and money management platforms.</p></div></a><a class="group relative isolate flex flex-col gap-6 overflow-hidden" href="/templates/writemate-ai"><div class="relative overflow-hidden rounded-2xl bg-white p-7.5 pb-0"><div class="relative z-10 aspect-350/270 overflow-hidden rounded-t-xl shadow-[0_10.681px_32.574px_0_rgba(31,31,31,0.04)]"><img alt="WriteMate AI - React AI Website Template for Multi-LLM Content Platforms" loading="lazy" decoding="async" data-nimg="fill" class="rounded-t-xl object-cover object-top transition-transform" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1771816318893-writemate-lg.png&w=640&q=75 640w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1771816318893-writemate-lg.png&w=750&q=75 750w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1771816318893-writemate-lg.png&w=828&q=75 828w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1771816318893-writemate-lg.png&w=1080&q=75 1080w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1771816318893-writemate-lg.png&w=1200&q=75 1200w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1771816318893-writemate-lg.png&w=1920&q=75 1920w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1771816318893-writemate-lg.png&w=2048&q=75 2048w, /_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1771816318893-writemate-lg.png&w=3840&q=75 3840w" src="/_next/image?url=https%3A%2F%2Fassets.tailgrids.com%2F1771816318893-writemate-lg.png&w=3840&q=75"/></div><div class="absolute bottom-0 left-0">
1<svg width="408" height="297" viewBox="0 0 408 297" fill="none" xmlns="http://www.w3.org/2000/svg"><g filter="url(#filter0_f_13449_4607)"><rect x="40.3008" y="188.635" width="172.482" height="172.482" rx="86.2412" fill="#3758F9"></rect></g><defs><filter id="filter0_f_13449_4607" x="-259.699" y="-111.365" width="772.482" height="772.482" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="150" result="effect1_foregroundBlur_13449_4607"></feGaussianBlur></filter></defs></svg></div></div><div><h3 class="line-clamp-1 text-xl font-medium -tracking-[.5px] text-tg-text-color">WriteMate AI - React AI Website Template for Multi-LLM Content Platforms</h3><p class="mt-1 line-clamp-1 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base">React AI website template for AI writing tools, content, and chatbot platforms. Includes features, pricing, docs, support, Use Cases, and testimonials sections.</p></div></a></div></div><div class="flex items-end justify-center pt-14 pb-15"><div class="flex items-center justify-center gap-3 max-sm:flex-col"><a class="h-11 cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm font-medium duration-200 focus-visible:outline-none disabled:pointer-events-none bg-white hover:bg-gray-50 text-tg-title-color shadow-default-button hidden" aria-disabled="false" aria-busy="false" href="/"><svg class="size-6" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M10 10C10 9.33696 10.2634 8.70107 10.7322 8.23223C11.2011 7.76339 11.837 7.5 12.5 7.5C13.163 7.5 13.7989 7.76339 14.2678 8.23223C14.7366 8.70107 15 9.33696 15 10C15 10.663 14.7366 11.2989 14.2678 11.7678C13.7989 12.2366 13.163 12.5 12.5 12.5C11.837 12.5 11.2011 12.2366 10.7322 11.7678C10.2634 11.2989 10 10.663 10 10Z" fill="#1ABCFE"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5 15C5 14.337 5.26339 13.7011 5.73223 13.2322C6.20107 12.7634 6.83696 12.5 7.5 12.5H10V15C10 15.663 9.73661 16.2989 9.26777 16.7678C8.79893 17.2366 8.16304 17.5 7.5 17.5C6.83696 17.5 6.20107 17.2366 5.73223 16.7678C5.26339 16.2989 5 15.663 5 15Z" fill="#0ACF83"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M10 2.5V7.5H12.5C13.163 7.5 13.7989 7.23661 14.2678 6.76777C14.7366 6.29893 15 5.66304 15 5C15 4.33696 14.7366 3.70107 14.2678 3.23223C13.7989 2.76339 13.163 2.5 12.5 2.5H10Z" fill="#FF7262"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5 5C5 5.66304 5.26339 6.29893 5.73223 6.76777C6.20107 7.23661 6.83696 7.5 7.5 7.5H10V2.5H7.5C6.83696 2.5 6.20107 2.76339 5.73223 3.23223C5.26339 3.70107 5 4.33696 5 5Z" fill="#F24E1E"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5 10C5 10.663 5.26339 11.2989 5.73223 11.7678C6.20107 12.2366 6.83696 12.5 7.5 12.5H10V7.5H7.5C6.83696 7.5 6.20107 7.76339 5.73223 8.23223C5.26339 8.70107 5 9.33696 5 10Z" fill="#A259FF"></path></svg><span>Preview<!-- --> <span class="text-tg-text-color-secondary"> <!-- -->- Figma<!-- --> </span> </span><svg class="size-6" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.91732 14.1667L12.084 10L7.91732 5.83335" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"></path></svg></a><a class="inline-flex h-11 cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm font-medium duration-200 focus-visible:outline-none disabled:pointer-events-none bg-gray-800 hover:bg-gray-900 text-white shadow-secondary-button" aria-disabled="false" aria-busy="false" href="/templates"><span>Browse All<!-- --> <span class="text-white/70"> - Templates </span> </span><svg class="size-6" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.91732 14.1667L12.084 10L7.91732 5.83335" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"></path></svg></a></div></div></div></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
1<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div></div></section><section class="overflow-hidden"><div class="relative mx-auto w-full max-w-[1456px]"><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="p-5 pt-10 sm:p-10 sm:pt-20"><div class="w-full max-w-[800px]"><div class="mb-4"><span class="inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium text-tg-text-color-secondary" style="box-shadow:0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.37109 2.18945C8.61822 2.1896 8.84459 2.33022 8.9541 2.55176L10.752 6.19531L14.7734 6.78027C15.0181 6.81596 15.2214 6.98752 15.2979 7.22266C15.3742 7.45777 15.3106 7.71597 15.1338 7.88867L12.2236 10.7256L12.9111 14.7295C12.9529 14.9731 12.8521 15.2198 12.6523 15.3652C12.4522 15.5106 12.1867 15.53 11.9678 15.415L8.37109 13.5234L4.77441 15.415C4.55551 15.53 4.28994 15.5105 4.08984 15.3652C3.88997 15.2198 3.79024 14.9732 3.83203 14.7295L4.51758 10.7256L1.6084 7.88867C1.43148 7.71599 1.36796 7.45781 1.44434 7.22266C1.52084 6.9876 1.72414 6.81593 1.96875 6.78027L5.98926 6.19531L7.78809 2.55176L7.83496 2.47266C7.95496 2.29754 8.15492 2.18951 8.37109 2.18945ZM7.00488 7.07812C6.91028 7.26959 6.72691 7.40264 6.51562 7.43359L3.45898 7.87695L5.6709 10.0332C5.82369 10.1824 5.89344 10.3979 5.85742 10.6084L5.33496 13.6514L8.06836 12.2148L8.1416 12.1816C8.31417 12.1166 8.50837 12.1279 8.67383 12.2148L11.4062 13.6514L10.8848 10.6084C10.8487 10.3976 10.9191 10.1825 11.0723 10.0332L13.2832 7.87695L10.2275 7.43359C10.016 7.40286 9.83303 7.26969 9.73828 7.07812L8.37109 4.30859L7.00488 7.07812ZM15.3809 3.78418C15.6347 3.53045 16.047 3.53041 16.3008 3.78418C16.5543 4.03799 16.5544 4.45035 16.3008 4.7041L15.1758 5.8291C14.9221 6.08279 14.5097 6.08258 14.2559 5.8291C14.0022 5.57528 14.0021 5.16299 14.2559 4.90918L15.3809 3.78418ZM15.2119 0.771484C15.4657 0.517932 15.8781 0.517971 16.1318 0.771484C16.3856 1.02528 16.3855 1.43757 16.1318 1.69141L12.835 4.9873C12.5811 5.24112 12.1689 5.24117 11.915 4.9873C11.6616 4.73344 11.6614 4.32206 11.915 4.06836L15.2119 0.771484ZM11.6367 1.16406C11.8905 0.910725 12.3019 0.910727 12.5557 1.16406C12.8095 1.41788 12.8095 1.83013 12.5557 2.08398L11.4316 3.20898C11.1779 3.46276 10.7656 3.46264 10.5117 3.20898C10.2581 2.95524 10.2582 2.54387 10.5117 2.29004L11.
16367 1.16406Z" fill="currentColor"></path></svg>Testimonials</span></div><h2 class="mb-4.5 text-2xl font-medium -tracking-[1.5px] text-tg-title-color sm:text-3xl md:text-4xl lg:text-[40px]/[48px] max-w-[540px] w-full">Wall of Love from Teams Building with Tailgrids</h2><div class="text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base md:text-lg *:[&>strong]:font-medium *:[&>strong]:text-tg-title-color"><p> 2Trusted by creators, product teams, startups, and companies building production-grade applications. 3</p></div></div></div><div class="relative bg-gray-100 p-5 sm:p-10"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="columns-1 gap-2 md:columns-2 lg:columns-3"><div class="group @container/card relative mb-2 break-inside-avoid"><div class="gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10"><div class="flex gap-3.5"><div class="size-10 min-w-10 overflow-hidden rounded-full"><img alt="Fajar Siddiq" loading="lazy" width="40" height="40" decoding="async" data-nimg="1" class="object-cover object-center" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Ftestimonials%2Ffajar.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Ftestimonials%2Ffajar.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Ftestimonials%2Ffajar.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="w-full"><div class="flex items-center justify-between gap-2.5"><h3 class="text-base font-medium -tracking-[.2px] text-tg-title-color">Fajar Siddiq</h3><div class="flex gap-0.5"><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg>
3<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg></div></div><p class="mt-1 text-sm -tracking-[.2px] text-gray-400">Serial Entrepreneur, Singapore</p></div></div><div class="mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base">Tailgrids is such a great help when comes to building landing page and web app UI for Tailwind CSS web projects with just copy-paste method! is really liked the design and it is easy to get started which saves tons of time & money for developers and designers with Figma files & source code!</div></div><div class="pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100"><span class="top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5"></span><span class="top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5"></span><span class="bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5"></span><span class="right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5"></span></div></div><div class="group @container/card relative mb-2 break-inside-avoid"><div class="gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10"><div class="flex gap-3.5"><div class="size-10 min-w-10 overflow-hidden rounded-full"><img alt="Marko Denic" loading="lazy" width="40" height="40" decoding="async" data-nimg="1" class="object-cover object-center" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Ftestimonials%2Fmarko.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Ftestimonials%2Fmarko.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Ftestimonials%2Fmarko.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="w-full"><div class="flex items-center justify-between gap-2.5"><h3 class="text-base font-medium -tracking-[.2px] text-tg-title-color">Marko Denic</h3><div class="flex gap-0.5"><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg>
3<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg></div></div><p class="mt-1 text-sm -tracking-[.2px] text-gray-400">Developer Advocate and Software Engineer</p></div></div><div class="mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base">Tailgrids comes with all the essential UI components you need to create beautiful websites based on Tailwind CSS. The design consistency & variations of UI components, clean codebase, copy-paste interface, and detailed documentation made this UI library very organized & super easy to use.</div></div><div class="pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100"><span class="top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5"></span><span class="top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5"></span><span class="bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5"></span><span class="right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5"></span></div></div><div class="group @container/card relative mb-2 break-inside-avoid"><div class="gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10"><div class="flex gap-3.5"><div class="size-10 min-w-10 overflow-hidden rounded-full"><img alt="Athar Ahmed" loading="lazy" width="40" height="40" decoding="async" data-nimg="1" class="object-cover object-center" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Ftestimonials%2Fathar.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Ftestimonials%2Fathar.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Ftestimonials%2Fathar.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="w-full"><div class="flex items-center justify-between gap-2.5"><h3 class="text-base font-medium -tracking-[.2px] text-tg-title-color">Athar Ahmed</h3><div class="flex gap-0.5">
3<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg></div></div><p class="mt-1 text-sm -tracking-[.2px] text-gray-400">Founder, ScrapeOwl and Senior Software Engineer @Aide</p></div></div><div class="mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base">Since I like doing engineering parts only, designing and coding landing pages is great blocker for me while I develop MVPs or try to validate a new product idea. Tailgrids seems have great collection of UI components that also comes relevant contents and Figma file that I can use to play or create prototype before diving into code.</div></div><div class="pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100"><span class="top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5"></span><span class="top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5"></span><span class="bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5"></span><span class="right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5"></span></div></div><div class="group @container/card relative mb-2 break-inside-avoid"><div class="gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10"><div class="flex gap-3.5"><div class="size-10 min-w-10 overflow-hidden rounded-full"><img alt="Ostap Brehin" loading="lazy" width="40" height="40" decoding="async" data-nimg="1" class="object-cover object-center" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Ftestimonials%2Fostap.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Ftestimonials%2Fostap.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Ftestimonials%2Fostap.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="w-full"><div class="flex items-center justify-between gap-2.5"><h3 class="text-base font-medium -tracking-[.2px] text-tg-title-color">Ostap Brehin</h3><div class="flex gap-0.5">
3<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg></div></div><p class="mt-1 text-sm -tracking-[.2px] text-gray-400">Fullstack Developer and Building NotionMailer</p></div></div><div class="mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base">A landing page is the first thing your customers will see before even trying the project. You want to make sure it looks great, and this is where Tailgrids comes to help! It provides a collection of beautiful hand-crafted uniquely-looking components that you can use to build your startup website, web application, or dashboard.</div></div><div class="pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100"><span class="top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5"></span><span class="top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5"></span><span class="bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5"></span><span class="right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5"></span></div></div><div class="group @container/card relative mb-2 break-inside-avoid"><div class="gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10"><div class="flex gap-3.5"><div class="size-10 min-w-10 overflow-hidden rounded-full"><img alt="Arnob Mukherjee" loading="lazy" width="40" height="40" decoding="async" data-nimg="1" class="object-cover object-center" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Ftestimonials%2Farnob.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Ftestimonials%2Farnob.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Ftestimonials%2Farnob.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="w-full"><div class="flex items-center justify-between gap-2.5"><h3 class="text-base font-medium -tracking-[.2px] text-tg-title-color">
3Arnob Mukherjee</h3><div class="flex gap-0.5"><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg></div></div><p class="mt-1 text-sm -tracking-[.2px] text-gray-400">Founder @Olvy</p></div></div><div class="mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base">Seems like an amazing alternative to tailwindui, also the design looks amazing man ð</div></div><div class="pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100"><span class="top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5"></span><span class="top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5"></span><span class="bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5"></span><span class="right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5"></span></div></div><div class="group @container/card relative mb-2 break-inside-avoid"><div class="gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10"><div class="flex gap-3.5"><div class="size-10 min-w-10 overflow-hidden rounded-full"><img alt="Kamal Hosen" loading="lazy" width="40" height="40" decoding="async" data-nimg="1" class="object-cover object-center" style="color:transparent" srcSet="/_next/image?url=%2Fimages%2Ftestimonials%2Fkamal.png&w=48&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 1x, /_next/image?url=%2Fimages%2Ftestimonials%2Fkamal.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ 2x" src="/_next/image?url=%2Fimages%2Ftestimonials%2Fkamal.png&w=96&q=75&dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></div><div class="w-full"><div class="flex items-center justify-between gap-2.5"><h3 class="text-base font-medium -tracking-[.2px] text-tg-title-color">Kamal Hosen</h3><div class="flex gap-0.5">
3<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z" fill="#FACC15"></path></svg></div></div><p class="mt-1 text-sm -tracking-[.2px] text-gray-400">Software Developer @HappyAddons</p></div></div><div class="mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base">Having used almost all the Tailwind CSS UI toolkits and resources, I can confidently say that Tailgrids is the easiest and most comprehensive Tailwind UI Library with almost all essential Tailwind CSS components you may
3need to build web UI faster. Specially, code explorer and copy-paste inteface is time-saver. Highly recommended!</div></div><div class="pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100"><span class="top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5"></span><span class="top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5"></span><span class="bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5"></span><span class="right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5"></span></div></div></div></div><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
3<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div></div></section><div class="mb-20"><section class="overflow-hidden bg-gray-950"><div class="relative mx-auto w-full max-w-[1456px]"><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-gray-950 [--pattern-fg:var(--border-2)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="py-14 lg:py-20"><div class="relative"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-2)]"></div><div class="flex flex-col items-center gap-4 xl:grid xl:grid-cols-12"><div class="pt-5 xl:col-span-4 xl:py-0 xl:pl-10"><h2 class="text-center font-mono text-2xl leading-10 font-[106] tracking-[-2px] text-white sm:text-4xl xl:text-left">Tailgrids Community</h2></div><div class="relative xl:col-span-4"><div class="absolute bg-(--pattern-fg) left-0 w-px [--pattern-fg:var(--border-2)] top-1/2 hidden h-[200vh] -translate-y-1/2 max-lg:hidden xl:block"></div><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-2)] hidden xl:hidden"></div><p class="mb-3 max-w-md px-5 text-center text-base tracking-[-0.2px] text-gray-300 sm:pl-10 lg:pl-7 xl:mb-0 xl:max-w-full xl:text-left">Join our Discord to stay up to date with the latest updates, releases, and offers.</p></div><div class="relative flex px-5 pb-5 xl:col-span-4 xl:justify-end xl:px-3 xl:py-3"><div class="absolute bg-(--pattern-fg) left-0 w-px [--pattern-fg:var(--border-2)] top-1/2 hidden h-[200vh] -translate-y-1/2 max-lg:hidden xl:block"></div><a href="https://pimjo.com/community" class="inline-flex h-11 cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm font-medium duration-200 focus-visible:outline-none disabled:pointer-events-none bg-primary-500 hover:bg-primary-600 text-white shadow-primary-button" aria-disabled="false" aria-busy="false"><svg class="size-5 shrink-0" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.7271 3.76687C13.6435 3.2681 12.499 2.91407 11.3231 2.71387C11.1631 3.00387 11.0177 3.30087 10.8871 3.60487C9.63489 3.41499 8.36125 3.41499 7.10907 3.60487C6.97853 3.30118 6.83302 3.00415 6.67307 2.71487C5.49628 2.91657 4.35091 3.27124 3.26607 3.76987C1.11207 6.97387 0.528069 10.0989 0.820069 13.1789C2.08069 14.1153 3.49293 14.828 4.99507 15.2859C5.33374 14.8279 5.63174 14.3445 5.88907 13.8359C5.40107 13.6521 4.92996 13.4262 4.48107 13.1609C4.59974 13.0742 4.71474 12.9872 4.82607 12.8999C6.13095 13.5172 7.55652 13.8374 9.00007 13.8374C10.4436 13.8374 11.8692 13.5172 13.1741 12.8999C13.2874 12.9932 13.4024 13.0799 13.5191 13.1599C13.0677 13.4272 12.5977 13.6532 12.1091 13.8379C12.3657 14.3459 12.6634 14.8285 13.0021 15.2859C14.5059 14.8305 15.9195 14.118 17.1801 13.1799C17.5231 9.60787 16.5951 6.51187 14.7271 3.76687ZM6.26007 11.2849C5.44607 11.2849 4.77407 10.5419 4.77407 9.62887C4.77407 8.71587 5.42307 7.96687 6.25707 7.96687C7.09107 7.96687 7.75907 8.71587 7.74507 9.62887C7.73107 10.5419 7.08907 11.2849 6.26007 11.2849ZM11.7421 11.2849C10.9271 11.2849 10.2571 10.5419 10.2571 9.62887C10.2571 8.71587 10.9071 7.96687 11.7421 7.96687C12.5771 7.96687 13.2401 8.71587 13.2251 9.62887C13.2101 10.5419 12.5711 11.2849 11.7421 11.2849Z" fill="currentColor"></path></svg>Join Our Discord Community</a></div></div><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-2)]"></div></div></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
3<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div></div></section></div><!--$--><!--/$--></div><!--$--><!--/$--><footer class="overflow-hidden"><div class="relative z-10 mx-auto w-full max-w-[1456px]"><div class="relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]"><div class="col-start-2 w-full max-w-[1600px] min-w-0"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="bg-white"><div class="flex flex-col justify-between gap-8 gap-y-15 px-6 py-10 md:px-10 md:py-20 lg:flex-row"><div class="flex w-full flex-col items-start md:w-auto lg:max-w-[270px] xl:min-w-5/12"><div class="mb-8"><a href="/"><img alt="Tailgrids Logo" loading="lazy" width="142" height="42" decoding="async" data-nimg="1" style="color:transparent" src="/images/tailgrids-full-logo.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></a></div><div class="mb-6 max-w-[438px] text-start text-base leading-6 text-gray-500 md:mb-12">An open-source React UI component library built with Tailwind CSS, including UI blocks and pre-built templates for modern web apps.</div><div class="flex items-center justify-start gap-2"><a target="_blank" rel="noopener noreferrer" aria-label="X" class="flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none size-8" href="https://x.com/tailgrids"><span class="shrink-0"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.0532 2.625H15.2132L10.4922 8.025L16.0472 15.375H11.6972L8.29117 10.918L4.39217 15.375H2.23017L7.28017 9.598L1.95117 2.625H6.41117L9.49117 6.699L13.0532 2.625ZM12.2932 14.08H13.4922L5.76017 3.852H4.47617L12.2952 14.08H12.2932Z" fill="currentColor"></path></svg></span></a><a target="_blank" rel="noopener noreferrer" aria-label="Github" class="flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none h-8 w-[63px] gap-1.5" href="https://github.com/Tailgrids/tailgrids"><span class="shrink-0"><svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 1.46289C13.144 1.46289 16.5 4.81889 16.5 8.96289C16.5 10.5345 16.0068 12.0666 15.0901 13.3432C14.1734 14.6198 12.8792 15.5766 11.39 16.0789C11.016 16.1539 10.875 15.9189 10.875 15.7219C10.875 15.4689 10.885 14.6629 10.885 13.6599C10.885 12.9569 10.65 12.5069 10.378 12.2719C12.047 12.0849 13.8 11.4469 13.8 8.56889C13.8 7.74389 13.51 7.07889 13.031 6.55389C13.106 6.36589 13.369 5.59689 12.956 4.56589C12.956 4.56589 12.328 4.35989 10.894 5.33489C10.2833 5.16609 9.65257 5.08098 9.019 5.08189C8.38543 5.08098 7.75467 5.16609 7.144 5.33489C5.709 4.36889 5.081 4.56589 5.081 4.56589C4.669 5.59689 4.931 6.36589 5.006 6.55389C4.50192 7.10281 4.2268 7.8237 4.237 8.56889C4.237 11.4379 5.981 12.0849 7.65 12.2719C7.434 12.4599 7.237 12.7879 7.172 13.2749C6.741 13.4719 5.662 13.7909 4.988 12.6569C4.847 12.4319 4.425 11.8789 3.834 11.8879C3.206 11.8979 3.581 12.2439 3.844 12.3849C4.162 12.5629 4.528 13.2289 4.612 13.4449C4.762 13.8659 5.25 14.6719 7.134 14.3249C7.134 14.9539 7.144 15.5449 7.144 15.7219C7.144 15.9189 7.004 16.1439 6.628 16.0789C5.13457 15.581 3.83567 14.6258 2.91531 13.3487C1.99495 12.0715 1.4998 10.5371 1.5 8.96289C1.5 4.81889 4.856 1.46289 9 1.46289Z" fill="currentColor"></path></svg></span><span class="text-sm font-medium text-tg-text-color-secondary">1.6k</span></a><a target="_blank" rel="noopener noreferrer" aria-label="Discord" class="flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none size-8" href="https://pimjo.com/community"><span class="shrink-0">
3<svg class="size-4.5" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.7271 3.76687C13.6435 3.2681 12.499 2.91407 11.3231 2.71387C11.1631 3.00387 11.0177 3.30087 10.8871 3.60487C9.63489 3.41499 8.36125 3.41499 7.10907 3.60487C6.97853 3.30118 6.83302 3.00415 6.67307 2.71487C5.49628 2.91657 4.35091 3.27124 3.26607 3.76987C1.11207 6.97387 0.528069 10.0989 0.820069 13.1789C2.08069 14.1153 3.49293 14.828 4.99507 15.2859C5.33374 14.8279 5.63174 14.3445 5.88907 13.8359C5.40107 13.6521 4.92996 13.4262 4.48107 13.1609C4.59974 13.0742 4.71474 12.9872 4.82607 12.8999C6.13095 13.5172 7.55652 13.8374 9.00007 13.8374C10.4436 13.8374 11.8692 13.5172 13.1741 12.8999C13.2874 12.9932 13.4024 13.0799 13.5191 13.1599C13.0677 13.4272 12.5977 13.6532 12.1091 13.8379C12.3657 14.3459 12.6634 14.8285 13.0021 15.2859C14.5059 14.8305 15.9195 14.118 17.1801 13.1799C17.5231 9.60787 16.5951 6.51187 14.7271 3.76687ZM6.26007 11.2849C5.44607 11.2849 4.77407 10.5419 4.77407 9.62887C4.77407 8.71587 5.42307 7.96687 6.25707 7.96687C7.09107 7.96687 7.75907 8.71587 7.74507 9.62887C7.73107 10.5419 7.08907 11.2849 6.26007 11.2849ZM11.7421 11.2849C10.9271 11.2849 10.2571 10.5419 10.2571 9.62887C10.2571 8.71587 10.9071 7.96687 11.7421 7.96687C12.5771 7.96687 13.2401 8.71587 13.2251 9.62887C13.2101 10.5419 12.5711 11.2849 11.7421 11.2849Z" fill="currentColor"></path></svg></span></a></div></div><div class="flex flex-1 flex-col items-start gap-4 max-sm:gap-y-12 sm:flex-row xl:gap-8"><div class="flex flex-col items-start gap-6 sm:w-1/2 md:w-1/3 md:gap-7"><h3 class="font-mono text-base leading-6 font-normal tracking-[-0.2px] text-gray-500">Resources</h3><div class="flex flex-col gap-4.5"><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/docs/changelog">Change Logs</a><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/roadmap">Roadmap</a><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/blocks">Tailgrids Blocks</a><a target="_blank" rel="noopener noreferrer" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="https://tailwindcss.com">Tailwind CSS</a><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/figma">Tailgrids UI - Tailwind Figma</a></div></div><div class="flex flex-col items-start gap-6 sm:w-1/2 md:w-1/3 md:gap-7"><h3 class="font-mono text-base leading-6 font-normal tracking-[-0.2px] text-gray-500">Useful Links</h3><div class="flex flex-col items-start gap-3 text-base leading-6 font-normal tracking-[-0.2px] text-gray-700 md:gap-4.5"><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/license">License</a><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/privacy-policy">Privacy Policy</a><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/refund-policy">Refund Policy</a><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/pricing">Download</a><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/icons">Icons</a></div></div><div class="flex flex-col items-start gap-6 sm:w-1/2 md:w-1/3 md:gap-7"><h3 class="text-start font-mono text-base leading-6 font-normal tracking-[-0.2px] text-gray-500">Help and Support</h3><div class="flex flex-col items-start gap-3 text-base leading-6 font-normal tracking-[-0.2px] text-gray-700 md:gap-4.5"><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/support">Support</a><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/docs">Docs</a><a target="_self" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="/pricing#faqs">FAQs</a><a target="_blank" rel="noopener noreferrer" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="https://pimjo.com/community">Community</a><a target="_blank" rel="noopener noreferrer" class="inline-flex cursor-pointer text-base text-tg-text-color duration-200 hover:text-primary-500" href="https://www.npmjs.com/package/@tailgrids/cli">Tailgrids CLI</a></div></div></div></div><div><div class="px-5 pb-6 leading-6 font-normal tracking-[-0.2px] text-gray-700 sm:px-10">Explore our others products</div><div class="relative bg-white"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="grid grid-cols-2 divide-x divide-tg-border-1 md:grid-cols-4 lg:grid-cols-6"><a target="_blank" rel="noopener noreferrer" class="group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0" href="https://lineicons.com/"><span class="flex h-6 items-center justify-center overflow-hidden"><span class="flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100"><img alt="Lineicons" loading="lazy" width="113" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/lineicons.05x01cvocy-v7.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/><img alt="Lineicons" loading="lazy" width="113" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/lineicons.05x01cvocy-v7.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></span></span></a><a target="_blank" rel="noopener noreferrer" class="group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0" href="https://tailadmin.com/"><span class="flex h-6 items-center justify-center overflow-hidden"><span class="flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100"><img alt="TailAdmin" loading="lazy" width="122" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/tailadmin.0yz~f-hsed3wc.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/><img alt="TailAdmin" loading="lazy" width="122" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/tailadmin.0yz~f-hsed3wc.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></span></span></a><a target="_blank" rel="noopener noreferrer" class="group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0" href="https://nextjstemplates.com/"><span class="flex h-6 items-center justify-center overflow-hidden"><span class="flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100"><img alt="Next.js Template" loading="lazy" width="80" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/nextjstemplates.0b8mkib8sr68w.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/><img alt="Next.js Template" loading="lazy" width="80" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/nextjstemplates.0b8mkib8sr68w.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></span></span></a><a target="_blank" rel="noopener noreferrer" class="group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0" href="https://meku.dev/"><span class="flex h-6 items-center justify-center overflow-hidden"><span class="flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100">
3<img alt="meku" loading="lazy" width="77" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/meku.02gp9mtz9zabt.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/><img alt="meku" loading="lazy" width="77" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/meku.02gp9mtz9zabt.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></span></span></a><a target="_blank" rel="noopener noreferrer" class="group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0" href="https://aymo.ai/"><span class="flex h-6 items-center justify-center overflow-hidden"><span class="flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100"><img alt="aymo" loading="lazy" width="95" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/aymo.13mwq30bn1yz6.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/><img alt="aymo" loading="lazy" width="95" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/aymo.13mwq30bn1yz6.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></span></span></a><a target="_blank" rel="noopener noreferrer" class="group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0" href="https://cozycommerce.dev/"><span class="flex h-6 items-center justify-center overflow-hidden"><span class="flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100"><img alt="CozyCommerce" loading="lazy" width="80" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/cozycommerce.0rq1.8z4lumat.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/><img alt="CozyCommerce" loading="lazy" width="80" height="22" decoding="async" data-nimg="1" class="h-5.5" style="color:transparent" src="/_next/static/media/cozycommerce.0rq1.8z4lumat.svg?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ"/></span></span></a></div></div></div><div class="relative mb-5 bg-gray-100 px-5 py-4 md:mb-15 md:px-10"><div class="absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div class="absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]"></div><div><p class="font-mono text-sm -tracking-[.2px] text-tg-text-color-secondary">© Copyright <!-- -->2026<!-- --> Tailgrids UI - All rights reserved.</p><p class="mt-2 text-sm -tracking-[0.2px] text-tg-text-color-secondary">The Tailwind name and logos are trademarks of Tailwind Labs Inc. Tailgrids UI is not affiliated with, associated with, or part of Tailwind Labs or the official Tailwind CSS.</p></div></div></div></div><div class="relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div>
3<div class="relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed"></div></div></div></footer></div>
3<script src="/_next/static/chunks/0m97bbjp.vgzu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ" id="_R_" async=""></script>
3<script>(self.__next_f=self.__next_f||[]).push([0])</script>
3<script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[156172,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"PaddleLoader\"]\n3:I[19598,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"GoogleTagManager\"]\n4:I[325825,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n5:I[176627,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"TanstackQueryProvider\"]\n6:I[846696,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"Toaster\"]\n7:I[818421,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n8:I[339756,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n9:I[837457,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\na:I[605500,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"Image\"]\nb:I[522016,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D9"])</script>
3<script>self.__next_f.push([1,"1iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"\"]\n15:I[168027,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\",1]\n18:I[823796,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n19:I[67752,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n1a:I[302355,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"Analytics\"]\n22:I[897367,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"OutletBoundary\"]\n23:\"$Sreact.suspense\"\n25:I[897367,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"ViewportBoundary\"]\n27:I[897367,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"MetadataBoundary\"]\n2b:I[263245,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iC"])</script>
3<script>self.__next_f.push([1,"QX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n2e:I[27201,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"IconMark\"]\n:HL[\"/_next/static/chunks/0nip9_xlnfah2.css?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"style\"]\n:HL[\"/_next/static/chunks/01rl.d.5n-_.t.css?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"style\"]\n:HL[\"/_next/static/media/5c285b27cdda1fe8-s.p.0yo6-5yoeeudq.woff2?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/5e50e46ec4da0455-s.p.14_f372x7nluw.woff2?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/797e433ab948586e-s.p.08e28id.o-okb.woff2?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n"])</script>
3<script>self.__next_f.push([1,"0:{\"P\":null,\"c\":[\"\",\"\"],\"q\":\"\",\"i\":false,\"f\":[[[\"\",{\"children\":[\"(site)\",{\"children\":[\"__PAGE__\",{}]}]},\"$undefined\",\"$undefined\",16],[[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/0nip9_xlnfah2.css?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/01rl.d.5n-_.t.css?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-2\",{\"src\":\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"script\",null,{\"src\":\"https://accounts.google.com/gsi/client\",\"async\":true,\"defer\":true}],[\"$\",\"$L2\",null,{}]]}],[\"$\",\"$L3\",null,{\"gtmId\":\"GTM-KGQFQXFN\"}],[\"$\",\"body\",null,{\"className\":\"dm_sans_9fb5127e-module__yy698a__variable geist_mono_a675bca4-module__Lt_QGq__variable relative overflow-x-hidden antialiased\",\"children\":[[\"$\",\"$L4\",null,{}],[\"$\",\"$L5\",null,{\"children\":[[\"$\",\"$L6\",null,{}],[\"$\",\"$L7\",null,{\"color\":\"#fff\",\"crawlSpeed\":300,\"showSpinner\":false,\"shadow\":\"none\",\"zIndex\":9999999}],[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L9\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[\"$\",\"div\",null,{\"className\":\"pb-10 sm:pb-20\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative mx-auto w-full max-w-[1456px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"col-start-2 w-full max-w-[1600px] min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-col items-center justify-center p-5 text-center sm:px-15 sm:py-37.5\",\"children\":[\"$\",\"div\",null,{\"className\":\"mx-auto max-w-[660px]\",\"children\":[[\"$\",\"$La\",null,{\"src\":\"/images/404.svg\",\"alt\":\"404 Not Found\",\"className\":\"pointer-events-none max-w-full\",\"width\":660,\"height\":260}],[\"$\",\"div\",null,{\"className\":\"mx-auto mt-10 max-w-md\",\"children\":[[\"$\",\"h1\",null,{\"className\":\"mb-5 text-5xl text-gray-700\",\"children\":\"Page Not Found\"}],[\"$\",\"p\",null,{\"className\":\"mb-7 text-base text-gray-500\",\"children\":\"The page you're looking for doesn't exist or has been moved. check the URL or go back to the homepage.\"}],[\"$\",\"$Lb\",null,{\"href\":\"/\",\"children\":[\"$\",\"button\",null,{\"className\":\"inline-flex h-11 cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm font-medium duration-200 focus-visible:outline-none disabled:pointer-events-none bg-gray-800 hover:bg-gray-900 text-white shadow-secondary-button\",\"aria-label\":\"$undefined\",\"aria-disabled\":false,\"aria-busy\":false,\"disabled\":false,\"ref\":\"$undefined\",\"children\":[false,[\" \",[\"$\",\"svg\",null,{\"className\":\"size-5\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":20,\"height\":20,\"viewBox\":\"0 0 20 20\",\"fill\":\"none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M12.0807 5.83331L7.91406 9.99998L12.0807 14.1666\",\"stroke\":\"white\",\"strokeOpacity\":\"0.7\",\"strokeWidth\":\"1.3\",\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\"}]}],\" Go back to Home\"]]}]}]]}]]}]}]]}],[\"$\",\"div\",null,{\"className\":\"relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}
3],[\"$\",\"div\",null,{\"className\":\"relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]]}]}]}],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]]}]]}]]}],{\"children\":[[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}],\"$Lc\",\"$Ld\",\"$Le\",\"$Lf\",\"$L10\",\"$L11\"],\"$L12\"]}],{\"children\":[\"$L13\",{},null,false,null]},null,false,null]},null,false,null],\"$L14\",false]],\"m\":\"$undefined\",\"G\":[\"$15\",[\"$L16\",\"$L17\"]],\"S\":false,\"h\":null,\"s\":\"$undefined\",\"l\":\"$undefined\",\"p\":\"$undefined\",\"d\":\"$undefined\"}\n"])</script>
3<script>self.__next_f.push([1,"c:[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}]\nd:[\"$\",\"script\",\"script-2\",{\"src\":\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}]\ne:[\"$\",\"script\",\"script-3\",{\"src\":\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}]\nf:[\"$\",\"script\",\"script-4\",{\"src\":\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}]\n10:[\"$\",\"script\",\"script-5\",{\"src\":\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}]\n11:[\"$\",\"script\",\"script-6\",{\"src\":\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}]\n"])</script>
3<script>self.__next_f.push([1,"12:[\"$\",\"div\",null,{\"className\":\"isolate flex min-h-svh flex-col\",\"children\":[[\"$\",\"$L18\",null,{}],[\"$\",\"$L19\",null,{}],[\"$\",\"div\",null,{\"className\":\"flex-1\",\"children\":[\"$\",\"$L8\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L9\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[\"$\",\"div\",null,{\"className\":\"pb-10 sm:pb-20\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative mx-auto w-full max-w-[1456px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"col-start-2 w-full max-w-[1600px] min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-col items-center justify-center p-5 text-center sm:px-15 sm:py-37.5\",\"children\":[\"$\",\"div\",null,{\"className\":\"mx-auto max-w-[660px]\",\"children\":[[\"$\",\"$La\",null,{\"src\":\"/images/404.svg\",\"alt\":\"404 Not Found\",\"className\":\"pointer-events-none max-w-full\",\"width\":660,\"height\":260}],[\"$\",\"div\",null,{\"className\":\"mx-auto mt-10 max-w-md\",\"children\":[[\"$\",\"h1\",null,{\"className\":\"mb-5 text-5xl text-gray-700\",\"children\":\"Page Not Found\"}],[\"$\",\"p\",null,{\"className\":\"mb-7 text-base text-gray-500\",\"children\":\"The page you're looking for doesn't exist or has been moved. check the URL or go back to the homepage.\"}],[\"$\",\"$Lb\",null,{\"href\":\"/\",\"children\":[\"$\",\"button\",null,{\"className\":\"inline-flex h-11 cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm font-medium duration-200 focus-visible:outline-none disabled:pointer-events-none bg-gray-800 hover:bg-gray-900 text-white shadow-secondary-button\",\"aria-label\":\"$undefined\",\"aria-disabled\":false,\"aria-busy\":false,\"disabled\":false,\"ref\":\"$undefined\",\"children\":[false,[\" \",[\"$\",\"svg\",null,{\"className\":\"size-5\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":20,\"height\":20,\"viewBox\":\"0 0 20 20\",\"fill\":\"none\",\"children\":[\"$\",\"path\",null,{\"d\":\"M12.0807 5.83331L7.91406 9.99998L12.0807 14.1666\",\"stroke\":\"white\",\"strokeOpacity\":\"0.7\",\"strokeWidth\":\"1.3\",\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\"}]}],\" Go back to Home\"]]}]}]]}]]}]}]]}],[\"$\",\"div\",null,{\"className\":\"relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}
3],[\"$\",\"div\",null,{\"className\":\"relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]]}]}]}],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}],[\"$\",\"$L1a\",null,{}],[\"$\",\"footer\",null,{\"className\":\"overflow-hidden\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative z-10 mx-auto w-full max-w-[1456px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"col-start-2 w-full max-w-[1600px] min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"bg-white\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-col justify-between gap-8 gap-y-15 px-6 py-10 md:px-10 md:py-20 lg:flex-row\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex w-full flex-col items-start md:w-auto lg:max-w-[270px] xl:min-w-5/12\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-8\",\"children\":[\"$\",\"$Lb\",null,{\"href\":\"/\",\"children\":[\"$\",\"$La\",null,{\"src\":\"/images/tailgrids-full-logo.svg\",\"alt\":\"Tailgrids Logo\",\"width\":142,\"height\":42}]}]}],[\"$\",\"div\",null,{\"className\":\"mb-6 max-w-[438px] text-start text-base leading-6 text-gray-500 md:mb-12\",\"children\":\"An open-source React UI component library built with Tailwind CSS, including UI blocks and pre-built templates for modern web apps.\"}],\"$L1b\"]}],\"$L1c\"]}],\"$L1d\",\"$L1e\"]}]]}],\"$L1f\",\"$L20\"]}]}]}]]}]\n"])</script>
3<script>self.__next_f.push([1,"13:[\"$\",\"$1\",\"c\",{\"children\":[\"$L21\",[[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-2\",{\"src\":\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"$L22\",null,{\"children\":[\"$\",\"$23\",null,{\"name\":\"Next.MetadataOutlet\",\"children\":\"$@24\"}]}]]}]\n14:[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$L25\",null,{\"children\":\"$L26\"}],[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$L27\",null,{\"children\":[\"$\",\"$23\",null,{\"name\":\"Next.Metadata\",\"children\":\"$L28\"}]}]}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}]\n16:[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/0nip9_xlnfah2.css?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]\n17:[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/chunks/01rl.d.5n-_.t.css?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]\n29:T494,M9 1.46289C13.144 1.46289 16.5 4.81889 16.5 8.96289C16.5 10.5345 16.0068 12.0666 15.0901 13.3432C14.1734 14.6198 12.8792 15.5766 11.39 16.0789C11.016 16.1539 10.875 15.9189 10.875 15.7219C10.875 15.4689 10.885 14.6629 10.885 13.6599C10.885 12.9569 10.65 12.5069 10.378 12.2719C12.047 12.0849 13.8 11.4469 13.8 8.56889C13.8 7.74389 13.51 7.07889 13.031 6.55389C13.106 6.36589 13.369 5.59689 12.956 4.56589C12.956 4.56589 12.328 4.35989 10.894 5.33489C10.2833 5.16609 9.65257 5.08098 9.019 5.08189C8.38543 5.08098 7.75467 5.16609 7.144 5.33489C5.709 4.36889 5.081 4.56589 5.081 4.56589C4.669 5.59689 4.931 6.36589 5.006 6.55389C4.50192 7.10281 4.2268 7.8237 4.237 8.56889C4.237 11.4379 5.981 12.0849 7.65 12.2719C7.434 12.4599 7.237 12.7879 7.172 13.2749C6.741 13.4719 5.662 13.7909 4.988 12.6569C4.847 12.4319 4.425 11.8789 3.834 11.8879C3.206 11.8979 3.581 12.2439 3.844 12.3849C4.162 12.5629 4.528 13.2289 4.612 13.4449C4.762 13.8659 5.25 14.6719 7.134 14.3249C7.134 14.9539 7.144 15.5449 7.144 15.7219C7.144 15.9189 7.004 16.1439 6.628 16.0789C5.13457 15.581 3.83567 14.6258 2.91531 13.3487C1.99495 12.0715 1.4998 10.5371 1.5 8.96289C1.5 4.81889 4.856 1.46289 9 1.46289Z2a:T4e1,M14.7271 3.76687C13.6435 3.2681 12.499 2.91407 11.3231 2.71387C11.1631 3.00387 11.0177 3.30087 10.8871 3.60487C9.63489 3.41499 8.36125 3.41499 7.10907 3.60487C6.97853 3.30118 6.83302 3.00415 6.67307 2.71487C5.49628 2.91657 4.35091 3.27124 3.26607 3.76987C1.11207 6.97387 0.528069 10.0989 0.820069 13.1789C2.08069 14.1153 3.49293 14.828 4.99507 15.2859C5.33374 14.8279 5.63174 14.3445 5.88907 13.8359C5.40107 13.6521 4.92996 13.4262 4.48107 13.1609C4.59974 13.0742 4.71474 12.9872 4.82607 12.8999C6.13095 13.5172 7.55652 13.8374 9.00007 13.8374C10.4436 13.8374 11.8692 13.5172 13.1741 12.8999C13.2874 12.9932 13.4024 13.0799 13.5191 13.1599C13.0677 13.4272 12.5977 13.6532 12.1091 13.8379C12.3657 14.3459 12.6634 14.8285 13.0021 15.2859C14.5059 14.8305 15.9195 14.118 17.1801 13.1799C17.5231 9.60787 16.5951 6.51187 14.7271 3.76687ZM6.26007 11.2849C5.44607 11.2849 4.77407 10.5419 4.77407 9.62887C4.77407 8.71587 5.42307 7.96687 6.25707 7.96687C7.09107 7.96687 7.75907 8.71587 7.74507 9.62887C7.73107 10.5419 7.08907 11.2849 6.26007 11.2849ZM11.7421 11.2849C10.9271 11.2849 10.2571 10.5419 10.2571 9.62887C10.2571 8.71587 10.9071 7.96687 11.7421 7.96687C12.5771 7.96687 13.2401 8.71587 13.2251 9.62887C13.2101 10.5419 12.5711 11.2849 11.7421 11.2849Z"])</script>
3<script>self.__next_f.push([1,"1b:[\"$\",\"div\",null,{\"className\":\"flex items-center justify-start gap-2\",\"children\":[[\"$\",\"$Lb\",\"X\",{\"href\":\"https://x.com/tailgrids\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"aria-label\":\"X\",\"className\":\"flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none size-8\",\"children\":[[\"$\",\"span\",null,{\"className\":\"shrink-0\",\"children\":[\"$\",\"svg\",null,{\"className\":\"size-4.5\",\"viewBox\":\"0 0 18 18\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M13.0532 2.625H15.2132L10.4922 8.025L16.0472 15.375H11.6972L8.29117 10.918L4.39217 15.375H2.23017L7.28017 9.598L1.95117 2.625H6.41117L9.49117 6.699L13.0532 2.625ZM12.2932 14.08H13.4922L5.76017 3.852H4.47617L12.2952 14.08H12.2932Z\",\"fill\":\"currentColor\"}]}]}],false]}],[\"$\",\"$Lb\",\"Github\",{\"href\":\"https://github.com/Tailgrids/tailgrids\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"aria-label\":\"Github\",\"className\":\"flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none h-8 w-[63px] gap-1.5\",\"children\":[[\"$\",\"span\",null,{\"className\":\"shrink-0\",\"children\":[\"$\",\"svg\",null,{\"className\":\"size-4.5\",\"viewBox\":\"0 0 18 18\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"$29\",\"fill\":\"currentColor\"}]}]}],[\"$\",\"span\",null,{\"className\":\"text-sm font-medium text-tg-text-color-secondary\",\"children\":\"1.6k\"}]]}],[\"$\",\"$Lb\",\"Discord\",{\"href\":\"https://pimjo.com/community\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"aria-label\":\"Discord\",\"className\":\"flex cursor-pointer items-center justify-center rounded-lg text-tg-text-color-tertiary shadow-navbar-icon duration-200 hover:bg-gray-100 hover:text-tg-title-color hover:shadow-none size-8\",\"children\":[[\"$\",\"span\",null,{\"className\":\"shrink-0\",\"children\":[\"$\",\"svg\",null,{\"className\":\"size-4.5\",\"viewBox\":\"0 0 18 18\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"$2a\",\"fill\":\"currentColor\"}]}]}],false]}]]}]\n"])</script>
3<script>self.__next_f.push([1,"1c:[\"$\",\"div\",null,{\"className\":\"flex flex-1 flex-col items-start gap-4 max-sm:gap-y-12 sm:flex-row xl:gap-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-col items-start gap-6 sm:w-1/2 md:w-1/3 md:gap-7\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-mono text-base leading-6 font-normal tracking-[-0.2px] text-gray-500\",\"children\":\"Resources\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-col gap-4.5\",\"children\":[[\"$\",\"$L2b\",\"Change Logs\",{\"link\":{\"title\":\"Change Logs\",\"url\":\"/docs/changelog\",\"external\":false}}],[\"$\",\"$L2b\",\"Roadmap\",{\"link\":{\"title\":\"Roadmap\",\"url\":\"/roadmap\",\"external\":false}}],[\"$\",\"$L2b\",\"Tailgrids Blocks\",{\"link\":{\"title\":\"Tailgrids Blocks\",\"url\":\"/blocks\",\"external\":false}}],[\"$\",\"$L2b\",\"Tailwind CSS\",{\"link\":{\"title\":\"Tailwind CSS\",\"url\":\"https://tailwindcss.com\",\"external\":true}}],[\"$\",\"$L2b\",\"Tailgrids UI - Tailwind Figma\",{\"link\":{\"title\":\"Tailgrids UI - Tailwind Figma\",\"url\":\"/figma\",\"external\":false}}]]}]]}],[\"$\",\"div\",null,{\"className\":\"flex flex-col items-start gap-6 sm:w-1/2 md:w-1/3 md:gap-7\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-mono text-base leading-6 font-normal tracking-[-0.2px] text-gray-500\",\"children\":\"Useful Links\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-col items-start gap-3 text-base leading-6 font-normal tracking-[-0.2px] text-gray-700 md:gap-4.5\",\"children\":[[\"$\",\"$L2b\",\"License\",{\"link\":{\"title\":\"License\",\"url\":\"/license\",\"external\":false}}],[\"$\",\"$L2b\",\"Privacy Policy\",{\"link\":{\"title\":\"Privacy Policy\",\"url\":\"/privacy-policy\",\"external\":false}}],[\"$\",\"$L2b\",\"Refund Policy\",{\"link\":{\"title\":\"Refund Policy\",\"url\":\"/refund-policy\",\"external\":false}}],[\"$\",\"$L2b\",\"Download\",{\"link\":{\"title\":\"Download\",\"url\":\"/pricing\",\"external\":false}}],[\"$\",\"$L2b\",\"Icons\",{\"link\":{\"title\":\"Icons\",\"url\":\"/icons\",\"external\":false}}]]}]]}],[\"$\",\"div\",null,{\"className\":\"flex flex-col items-start gap-6 sm:w-1/2 md:w-1/3 md:gap-7\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-start font-mono text-base leading-6 font-normal tracking-[-0.2px] text-gray-500\",\"children\":\"Help and Support\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-col items-start gap-3 text-base leading-6 font-normal tracking-[-0.2px] text-gray-700 md:gap-4.5\",\"children\":[[\"$\",\"$L2b\",\"Support\",{\"link\":{\"title\":\"Support\",\"url\":\"/support\",\"external\":false}}],[\"$\",\"$L2b\",\"Docs\",{\"link\":{\"title\":\"Docs\",\"url\":\"/docs\",\"external\":false}}],[\"$\",\"$L2b\",\"FAQs\",{\"link\":{\"title\":\"FAQs\",\"url\":\"/pricing#faqs\",\"external\":false}}],[\"$\",\"$L2b\",\"Community\",{\"link\":{\"title\":\"Community\",\"url\":\"https://pimjo.com/community\",\"external\":true}}],[\"$\",\"$L2b\",\"Tailgrids CLI\",{\"link\":{\"title\":\"Tailgrids CLI\",\"url\":\"https://www.npmjs.com/package/@tailgrids/cli\",\"external\":true}}]]}]]}]]}]\n"])</script>
3<script>self.__next_f.push([1,"1d:[\"$\",\"div\",null,{\"children\":[[\"$\",\"div\",null,{\"className\":\"px-5 pb-6 leading-6 font-normal tracking-[-0.2px] text-gray-700 sm:px-10\",\"children\":\"Explore our others products\"}],[\"$\",\"div\",null,{\"className\":\"relative bg-white\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"grid grid-cols-2 divide-x divide-tg-border-1 md:grid-cols-4 lg:grid-cols-6\",\"children\":[[\"$\",\"$Lb\",\"0\",{\"href\":\"https://lineicons.com/\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 items-center justify-center overflow-hidden\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100\",\"children\":[[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/lineicons.05x01cvocy-v7.svg\",\"width\":113,\"height\":22,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Lineicons\",\"className\":\"h-5.5\"}],[\"$\",\"$La\",null,{\"src\":\"$1d:props:children:1:props:children:1:props:children:0:props:children:props:children:props:children:0:props:src\",\"alt\":\"Lineicons\",\"className\":\"h-5.5\"}]]}]}]}],[\"$\",\"$Lb\",\"1\",{\"href\":\"https://tailadmin.com/\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 items-center justify-center overflow-hidden\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100\",\"children\":[[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/tailadmin.0yz~f-hsed3wc.svg\",\"width\":122,\"height\":22,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"TailAdmin\",\"className\":\"h-5.5\"}],[\"$\",\"$La\",null,{\"src\":\"$1d:props:children:1:props:children:1:props:children:1:props:children:props:children:props:children:0:props:src\",\"alt\":\"TailAdmin\",\"className\":\"h-5.5\"}]]}]}]}],[\"$\",\"$Lb\",\"2\",{\"href\":\"https://nextjstemplates.com/\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 items-center justify-center overflow-hidden\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100\",\"children\":[[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/nextjstemplates.0b8mkib8sr68w.svg\",\"width\":80,\"height\":22,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Next.js Template\",\"className\":\"h-5.5\"}],[\"$\",\"$La\",null,{\"src\":\"$1d:props:children:1:props:children:1:props:children:2:props:children:props:children:props:children:0:props:src\",\"alt\":\"Next.js Template\",\"className\":\"h-5.5\"}]]}]}]}],[\"$\",\"$Lb\",\"3\",{\"href\":\"https://meku.dev/\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 items-center justify-center overflow-hidden\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100\",\"children\":[[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/meku.02gp9mtz9zabt.svg\",\"width\":77,\"height\"
3:22,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"meku\",\"className\":\"h-5.5\"}],[\"$\",\"$La\",null,{\"src\":\"$1d:props:children:1:props:children:1:props:children:3:props:children:props:children:props:children:0:props:src\",\"alt\":\"meku\",\"className\":\"h-5.5\"}]]}]}]}],[\"$\",\"$Lb\",\"4\",{\"href\":\"https://aymo.ai/\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0\",\"children\":\"$L2c\"}],\"$L2d\"]}]]}]]}]\n"])</script>
3<script>self.__next_f.push([1,"1e:[\"$\",\"div\",null,{\"className\":\"relative mb-5 bg-gray-100 px-5 py-4 md:mb-15 md:px-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"p\",null,{\"className\":\"font-mono text-sm -tracking-[.2px] text-tg-text-color-secondary\",\"children\":[\"© Copyright \",2026,\" Tailgrids UI - All rights reserved.\"]}],[\"$\",\"p\",null,{\"className\":\"mt-2 text-sm -tracking-[0.2px] text-tg-text-color-secondary\",\"children\":\"The Tailwind name and logos are trademarks of Tailwind Labs Inc. Tailgrids UI is not affiliated with, associated with, or part of Tailwind Labs or the official Tailwind CSS.\"}]]}]]}]\n1f:[\"$\",\"div\",null,{\"className\":\"relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n20:[\"$\",\"div\",null,{\"className\":\"relative -left-px col
3-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n2c:[\"$\",\"span\",null,{\"className\":\"flex h-6 items-center justify-center overflow-hidden\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100\",\"children\":[[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/aymo.13mwq30bn1yz6.svg\",\"width\":95,\"height\":22,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"aymo\",\"className\":\"h-5.5\"}],[\"$\",\"$La\",null,{\"src\":\"$2c:props:children:props:children:0:props:src\",\"alt\":\"aymo\",\"className\":\"h-5.5\"}]]}]}]\n2d:[\"$\",\"$Lb\",\"5\",{\"href\":\"https://cozycommerce.dev/\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"group/social flex h-20 items-center justify-center border-r border-tg-border-1 px-1 max-lg:border-b max-lg:last-of-type:border-b-0 max-lg:nth-[5]:border-b-0 lg:last-of-type:border-r-0\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 items-center justify-center overflow-hidden\",\"children\":[\"$\",\"span\",null,{\"className\":\"flex h-6 flex-col space-y-1 opacity-50 duration-200 ease-in-out group-hover/social:-translate-y-6 group-hover/social:opacity-100\",\"children\":[[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/cozycommerce.0rq1.8z4lumat.svg\",\"width\":80,\"height\":22,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"CozyCommerce\",\"className\":\"h-5.5\"}],[\"$\",\"$La\",null,{\"src\":\"$2d:props:children:props:children:props:children:0:props:src\",\"alt\":\"CozyCommerce\",\"className\":\"h-5.5\"}]]}]}]}]\n26:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n24:null\n"])</script>
3<script>self.__next_f.push([1,"28:[[\"$\",\"title\",\"0\",{\"children\":\"Tailgrids UI â Tailwind React Component Library and Design System\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Tailgrids UI is an open-source React component library built with Tailwind CSS. Build production-ready apps faster with reusable components, UI blocks, templates, CLI tooling, theming, and a Figma design system.\"}],[\"$\",\"link\",\"2\",{\"rel\":\"canonical\",\"href\":\"https://tailgrids.com\"}],[\"$\",\"meta\",\"3\",{\"property\":\"og:title\",\"content\":\"Tailgrids UI â Tailwind React Component Library and Design System - Tailgrids UI\"}],[\"$\",\"meta\",\"4\",{\"property\":\"og:description\",\"content\":\"Tailgrids UI is an open-source React component library built with Tailwind CSS. Build production-ready apps faster with reusable components, UI blocks, templates, CLI tooling, theming, and a Figma design system.\"}],[\"$\",\"meta\",\"5\",{\"property\":\"og:url\",\"content\":\"https://tailgrids.com\"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:image\",\"content\":\"https://tailgrids.com/tailgrids-og.png\"}],[\"$\",\"meta\",\"7\",{\"property\":\"og:type\",\"content\":\"website\"}],[\"$\",\"meta\",\"8\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"9\",{\"name\":\"twitter:title\",\"content\":\"Tailgrids UI â Tailwind React Component Library and Design System - Tailgrids UI\"}],[\"$\",\"meta\",\"10\",{\"name\":\"twitter:description\",\"content\":\"Tailgrids UI is an open-source React component library built with Tailwind CSS. Build production-ready apps faster with reusable components, UI blocks, templates, CLI tooling, theming, and a Figma design system.\"}],[\"$\",\"meta\",\"11\",{\"name\":\"twitter:image\",\"content\":\"https://tailgrids.com/tailgrids-og.png\"}],[\"$\",\"link\",\"12\",{\"rel\":\"icon\",\"href\":\"/favicon.ico?favicon.0bt5x~xl6dod1.ico\",\"sizes\":\"80x80\",\"type\":\"image/x-icon\"}],[\"$\",\"$L2e\",\"13\",{}]]\n"])</script>
3<script>self.__next_f.push([1,"2f:I[890321,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n30:I[922998,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n"])</script>
3<script>self.__next_f.push([1,"21:[[\"$\",\"$L2f\",null,{}],[\"$\",\"section\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"mx-auto max-w-[1456px] px-5 sm:px-10\",\"children\":[\"$\",\"div\",null,{\"className\":\"items-center lg:grid lg:grid-cols-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"px-10 pt-10 lg:col-span-1 lg:py-2.5\",\"children\":[\"$\",\"h2\",null,{\"className\":\"text-center text-sm -tracking-[.084px] text-tg-text-color-secondary lg:text-left\",\"children\":[\"Trusted by\",\" \",[\"$\",\"span\",null,{\"className\":\"font-semibold text-tg-title-color\",\"children\":\"150,000+ \"}],\" \",\"devs, designers, and teams worldwide.\"]}]}],[\"$\",\"div\",null,{\"className\":\"relative py-11 lg:col-span-3\",\"style\":{\"maskImage\":\"linear-gradient(to right, transparent, black 20%, black 80%, transparent)\"},\"children\":[\"$\",\"$L30\",null,{\"speed\":70,\"children\":[[\"$\",\"div\",\"1\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/backline.0bs0fo3.m_ics.svg\",\"width\":124,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Backline\"}]}],[\"$\",\"div\",\"2\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/buddy.0qqlsn39vqu6a.svg\",\"width\":55,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Buddy\"}]}],[\"$\",\"div\",\"3\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/build-lab.0avkq4n9y0xfg.svg\",\"width\":141,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Build Lab\"}]}],[\"$\",\"div\",\"4\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/cloud.05var-aw4nfs3.svg\",\"width\":100,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Cloud\"}]}],[\"$\",\"div\",\"5\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/creatorland.0kd8u4hh2-a6q.svg\",\"width\":194,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Creatorland\"}]}],[\"$\",\"div\",\"6\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/deloit.0a3qn-u_mwf.8.svg\",\"width\":108,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Deloit\"}]}],[\"$\",\"div\",\"7\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/exil.0trvrpkpoyule.svg\",\"width\":150,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Exil\"}]}],[\"$\",\"div\",\"8\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/ezo.0wfs~z~_jr1ac.svg\",\"width\":89,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Ezo\"}]}],[\"$\",\"div\",\"9\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/graph.11.hovbzv7e4q.svg\",\"width\":139,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Graph\"}]}],[\"$\",\"div\",\"10\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/landscap.07lxss42sjqlz.svg\",\"width\":147,\"height\":30,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Landscap\"}]}],[\"$\",\"div\",\"11\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/nautical.0l44~.9gsb9dd.svg\",\"width\":115,\"height\":28,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Nautical\"}]}],[\"$\",\"div\",\"12\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/trendly.0.f9f02jaj2i_.svg\",\"width\":87,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Trendly\"}]}],[\"$\",\"div\",\"13\",{\"className\":\"px-6\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/zeta.01-axemykcc9d.svg\",\"width\":95,\"height\":40,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"Zeta\"}]}]]}]}]]}]}]}],[\"$\",\"section\",null,{\"className\":\"overflow-hidden\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative mx-auto w-full max-w-[1456px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"col-start-2 w-full max-w-[1600px] min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"p-5 pt-10 sm:p-10 sm:pt-20\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full max-w-[800px]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-4\",\"children\":[\"$\",\"span\",null,{\"className\":\"inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium text-tg-text-color-secondary\",\"style\":{\"boxShadow\":\"0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset\"},\"children\":[[\"$\",\"svg\",null,{\"className\":\"size-4.5\",\"viewBox\":\"0 0 18 18\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M8.22949 1.77721C8.71502 1.53447 9.28691 1.53455 9.77246 1.77721L14.9912 4.38659C15.5753 4.67885 15.9443 5.27637 15.9443 5.92956V12.0712C15.9442 12.7244 15.5754 13.3219 14.9912 13.6141L9.77246 16.2225C9.28686 16.4653 8.71507 16.4653 8.22949 16.2225L3.01172 13.6141C2.42741 13.322 2.0587 12.7244 2.05859 12.0712V5.92956C2.05863 5.27627 2.42744 4.67881 3.01172 4.38659L8.22949 1.77721ZM3.25781 12.0712C3.25792 12.2699 3.37107 12.452 3.54883 12.5409L8.40137 14.9667V8.73717C8.2861 8.70275 8.17192 8.66196 8.0625 8.60729L3.25781 6.20495V12.0712ZM9.94043 8.60729C9.83073 8.66212 9.71616 8.70271 9.60059 8.73717V14.9667L14.4541 12.5409C14.6319 12.452 14.744 12.2699 14.7441 12.0712V6.20495L9.94043 8.60729ZM9.23633 2.85046C9.08859 2.7766 8.91435 2.77664 8.7666 2.85046L4 5.23327L8.59863 7.53405C8.85174 7.66054 9.15015 7.66037 9.40332 7.53405L14.002 5.23327L9.23633 2.85046Z\",\"fill\":\"currentColor\"}]}],\"Main Features\"]}]}],\"$L31\",\"$L32\"]}]}],\"$L33\",\"$L34\"]}],\"$L35\",\"$L36\"]}]}]}],\"$L37\",\"$L38\",\"$L39\",\"$L3a\",\"$L3b\",\"$L3c\"]\n"])</script>
3<script>self.__next_f.push([1,"3d:I[570301,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n45:I[148339,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n31:[\"$\",\"h2\",null,{\"className\":\"mb-4.5 text-2xl font-medium -tracking-[1.5px] text-tg-title-color sm:text-3xl md:text-4xl lg:text-[40px]/[48px] max-w-[540px] w-full\",\"children\":\"Build faster with a complete React UI component library\"}]\n32:[\"$\",\"div\",null,{\"className\":\"text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base md:text-lg *:[\u0026\u003estrong]:font-medium *:[\u0026\u003estrong]:text-tg-title-color\",\"children\":[\"$\",\"p\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"600+ free and pro React UI components, production-ready blocks, templates, and a complete design system built for teams who design, build, and ship at scale.\"}}]}]\n"])</script>
3<script>self.__next_f.push([1,"33:[\"$\",\"div\",null,{\"className\":\"relative bg-gray-100 p-5 sm:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"grid grid-cols-6 gap-2\",\"children\":[[[\"$\",\"div\",\"0\",{\"className\":\"col-span-6 lg:col-span-3\",\"children\":[\"$\",\"$L3d\",null,{\"className\":\"flex-col-reverse\",\"image\":{\"src\":\"/_next/static/media/image-1-1.02qna1.r4gm_6.png\",\"width\":1246,\"height\":796,\"blurWidth\":8,\"blurHeight\":5,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAsElEQVR42gGlAFr/AOns+P719ff/zc7S/+Dh5f/z9f7//v7+///////9/f3+AMfL3v9+gIn/Ky87/0FKY/+st9b/9vf9//v8/v/3+Pr/AHx/hP8ZHCf/BgsX/y85Vv+bqNH/7/L8//j5+//5+vr/AO7u8P+1trv/hoiQ/7m8xf/HydD/6uzv//n5+//7+/3/APX19/77+/7/9fb5/8vN0P+ttcH/mKKy/+Dj5v/9/f3+ZfOFD3HDeUsAAAAASUVORK5CYII=\"},\"title\":\"600+ UI Blocks and Components\",\"description\":\"Build faster with 600+ reusable React and Tailwind CSS UI blocks for applications, dashboards, marketing sites, eCommerce, and AI products.\",\"showTabs\":true,\"href\":\"/blocks\"}]}],[\"$\",\"div\",\"1\",{\"className\":\"col-span-6 lg:col-span-3\",\"children\":[\"$\",\"$L3d\",null,{\"className\":\"$undefined\",\"image\":{\"src\":\"/_next/static/media/image-2.12364.k2h4epw.png\",\"width\":1246,\"height\":924,\"blurWidth\":8,\"blurHeight\":6,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAGCAYAAAD+Bd/7AAAAwUlEQVR42g3OrW7CUABA4asaxF5kkxWd2Cxs02RibJkAFAkCiQDHK/EAGF6AgII0hJ+G/tFLub2U2x7qz0k+EV9Lzqog1QaZGVxPEiUpUkqUUoh1ULLYZaw2Hks3ZLYM6fSHND6+GI3HCDcs2QSGva85xDnztWIwmfL6/s/PXxsRXkp0bsjzOyq7sz1GtH57vDy/8d3qItLKYIoCrW/cqsj3fRzHwbIs6p9NRJSY6tR4p4D4nHA4eti2Ta32RKPe5AH5HpmHxUq3MQAAAABJRU5ErkJggg==\"},\"title\":\"Ready-to-Launch Templates\",\"description\":\"Production-ready React and Tailwind CSS templates built for real product flows, helping teams launch faster at scale.\",\"showTabs\":\"$undefined\",\"href\":\"/templates\"}]}]],[[\"$\",\"div\",\"0\",{\"className\":\"col-span-6 md:col-span-3 lg:col-span-2\",\"children\":[\"$\",\"a\",null,{\"target\":\"_blank\",\"href\":\"/figma\",\"className\":\"block cursor-pointer rounded-2xl border border-transparent bg-white p-2.5 transition hover:border-tg-border-1 hover:bg-gray-50\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-1.5 flex aspect-video items-center justify-center rounded-lg bg-white\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/image-3.0t4raqojc8~jl.png\",\"width\":813,\"height\":520,\"blurWidth\":8,\"blurHeight\":5,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAbUlEQVR42jWMSQ4DMQgE/f+f5mBnGWPALB08UQ4lIUpdzQP4o5rQ7XUn3ALMO1u/Nj4cUEuYJ+JIP1KwaGZ79In3pZhzgYhgZthVGU9C7yMbi99SREvsWvIPkfpTtrkC41UF4srHjapirXVq+QVrUZweauxtPQAAAABJRU5ErkJggg==\"},\"alt\":\"Figma Design System\",\"className\":\"rounded-lg object-cover\",\"quality\":100}]}],[\"$\",\"div\",null,{\"className\":\"p-4.5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-lg font-medium sm:text-xl\",\"children\":\"Figma Design System\"}],[\"$\",\"p\",null,{\"className\":\"line-clamp-2 text-sm text-tg-text-color-secondary xs:text-base\",\"children\":\"900+ Figma components with tokens and variants for precise, scalable design-to-development workflows.\"}]]}]]}]}],[\"$\",\"div\",\"1\",{\"className\":\"col-span-6 md:col-span-3 lg:col-span-2\",\"children\":[\"$\",\"a\",null,{\"target\":\"_blank\",\"href\":\"https://tailgrids.com/docs/components\",\"className\":\"block cursor-pointer rounded-2xl border border-transparent bg-white p-2.5 transition hover:border-tg-border-1 hover:bg-gray-50\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-1.5 flex aspect-video items-center justify-center rounded-lg bg-white\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/image-4.17ii7pp534vm6.png\",\"width\":813,\"height\":520,\"blurWidth\":8,\"blurHeight\":5,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAcElEQVR42k2Myw3DQAhE6b+VVJBKckoOiRRLvvm7u/zGwMlICBjeDOFWzILBiv9seH0ccTqxCFrrENGa+3HgNzEeT8H7a07uQTLXs49RoJlB1XB2d1LVik5BYk8gtTRGO6WwbjuWdatHukckna0VcAEoYZwErIs19QAAAABJRU5ErkJggg==\"},\"alt\":\"100+ Free UI Components\",\"className\":\"rounded-lg object-cover\",\"quality\":100}]}],\"$L3e\"]}]}],\"$L3f\"]]}]]}]\n"])</script>
3<script>self.__next_f.push([1,"34:[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}]\n35:[\"$\",\"div\",null,{\"className\":\"relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n36:[\"$\",\"div\",null,{\"className\":\"relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n40:T6bb,"])</script>
3<script>self.__next_f.push([1,"M6.375 9.52539C7.53479 9.52539 8.4746 10.4652 8.47461 11.625V13.5C8.4746 14.6598 7.53479 15.5996 6.375 15.5996H4.5C3.34021 15.5996 2.4004 14.6598 2.40039 13.5V11.625C2.4004 10.4652 3.34021 9.52539 4.5 9.52539H6.375ZM13.5 9.52539C14.6598 9.52539 15.5996 10.4652 15.5996 11.625V13.5C15.5996 14.6598 14.6598 15.5996 13.5 15.5996H11.625C10.4652 15.5996 9.5254 14.6598 9.52539 13.5V11.625C9.5254 10.4652 10.4652 9.52539 11.625 9.52539H13.5ZM4.5 10.7246C4.00295 10.7246 3.59962 11.128 3.59961 11.625V13.5C3.59962 13.997 4.00295 14.4004 4.5 14.4004H6.375C6.87205 14.4004 7.27538 13.997 7.27539 13.5V11.625C7.27538 11.128 6.87205 10.7246 6.375 10.7246H4.5ZM11.625 10.7246C11.128 10.7246 10.7246 11.128 10.7246 11.625V13.5C10.7246 13.997 11.1279 14.4004 11.625 14.4004H13.5C13.9971 14.4004 14.4004 13.997 14.4004 13.5V11.625C14.4004 11.128 13.997 10.7246 13.5 10.7246H11.625ZM6.375 2.40039C7.5348 2.40039 8.47461 3.3402 8.47461 4.5V6.375C8.4746 7.53479 7.53479 8.47461 6.375 8.47461H4.5C3.34021 8.47461 2.4004 7.53479 2.40039 6.375V4.5C2.40039 3.3402 3.3402 2.40039 4.5 2.40039H6.375ZM13.5 2.40039C14.6598 2.40039 15.5996 3.3402 15.5996 4.5V6.375C15.5996 7.53479 14.6598 8.47461 13.5 8.47461H11.625C10.4652 8.47461 9.5254 7.53479 9.52539 6.375V4.5C9.52539 3.3402 10.4652 2.40039 11.625 2.40039H13.5ZM4.5 3.59961C4.00294 3.59961 3.59961 4.00294 3.59961 4.5V6.375C3.59962 6.87205 4.00295 7.27539 4.5 7.27539H6.375C6.87205 7.27539 7.27538 6.87205 7.27539 6.375V4.5C7.27539 4.00294 6.87206 3.59961 6.375 3.59961H4.5ZM11.625 3.59961C11.1279 3.59961 10.7246 4.00294 10.7246 4.5V6.375C10.7246 6.87205 11.1279 7.27539 11.625 7.27539H13.5C13.9971 7.27539 14.4004 6.87205 14.4004 6.375V4.5C14.4004 4.00294 13.9971 3.59961 13.5 3.59961H11.625Z"])</script>
3<script>self.__next_f.push([1,"37:[\"$\",\"section\",null,{\"className\":\"mt-20 overflow-hidden bg-gray-950\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative mx-auto w-full max-w-[1456px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-gray-950 [--pattern-fg:var(--border-2)]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"col-start-2 w-full max-w-[1600px] min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)] -mt-px\"}],[\"$\",\"div\",null,{\"className\":\"p-5 pt-10 sm:p-10 sm:pt-20\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full max-w-[800px]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-4\",\"children\":[\"$\",\"span\",null,{\"className\":\"inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium bg-gray-800 text-gray-400\",\"style\":{\"boxShadow\":\"0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset\"},\"children\":[[\"$\",\"svg\",null,{\"className\":\"size-4.5\",\"viewBox\":\"0 0 18 18\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"$40\",\"fill\":\"currentColor\"}]}],\"Core Features\"]}]}],[\"$\",\"h2\",null,{\"className\":\"mb-4.5 text-2xl font-medium -tracking-[1.5px] sm:text-3xl md:text-4xl lg:text-[40px]/[48px] text-white max-w-[550px] w-full\",\"children\":\"Build faster with a complete React + Tailwind UI library\"}],[\"$\",\"div\",null,{\"className\":\"text-sm -tracking-[.2px] xs:text-base md:text-lg *:[\u0026\u003estrong]:font-medium text-gray-400 *:[\u0026\u003estrong]:text-gray-300\",\"children\":[\"$\",\"p\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"600+ free and pro React UI components, production-ready blocks, templates, and a complete design system built for teams who design, build, and ship at scale.\"}}]}]]}]}],\"$L41\",\"$L42\"]}],\"$L43\",\"$L44\"]}]}]}]\n"])</script>
3<script>self.__next_f.push([1,"38:[\"$\",\"$L45\",null,{}]\n46:T740,"])</script>
3<script>self.__next_f.push([1,"M6.71764 3.78214L8.46964 2.03014C8.61028 1.88953 8.80101 1.81055 8.99989 1.81055C9.19876 1.81055 9.38949 1.88953 9.53014 2.03014L11.2821 3.78214C11.4227 3.92278 11.5017 4.11351 11.5017 4.31239C11.5017 4.51126 11.4227 4.70199 11.2821 4.84264L9.53014 6.59464C9.38949 6.73524 9.19876 6.81423 8.99989 6.81423C8.80101 6.81423 8.61028 6.73524 8.46964 6.59464L6.71764 4.84264C6.57703 4.70199 6.49805 4.51126 6.49805 4.31239C6.49805 4.11351 6.57703 3.92278 6.71764 3.78214ZM6.71764 13.1571L8.46964 11.4051C8.61028 11.2645 8.80101 11.1855 8.99989 11.1855C9.19876 11.1855 9.38949 11.2645 9.53014 11.4051L11.2821 13.1571C11.4227 13.2978 11.5017 13.4885 11.5017 13.6874C11.5017 13.8863 11.4227 14.077 11.2821 14.2176L9.53014 15.9696C9.38949 16.1102 9.19876 16.1892 8.99989 16.1892C8.80101 16.1892 8.61028 16.1102 8.46964 15.9696L6.71764 14.2176C6.57703 14.077 6.49805 13.8863 6.49805 13.6874C6.49805 13.4885 6.57703 13.2978 6.71764 13.1571ZM2.03014 8.46964L3.78214 6.71764C3.92278 6.57703 4.11351 6.49805 4.31239 6.49805C4.51126 6.49805 4.70199 6.57703 4.84264 6.71764L6.59464 8.46964C6.73524 8.61028 6.81423 8.80101 6.81423 8.99989C6.81423 9.19876 6.73524 9.38949 6.59464 9.53014L4.84264 11.2821C4.70199 11.4227 4.51126 11.5017 4.31239 11.5017C4.11351 11.5017 3.92278 11.4227 3.78214 11.2821L2.03014 9.53014C1.88953 9.38949 1.81055 9.19876 1.81055 8.99989C1.81055 8.80101 1.88953 8.61028 2.03014 8.46964ZM11.4051 8.46964L13.1571 6.71764C13.2978 6.57703 13.4885 6.49805 13.6874 6.49805C13.8863 6.49805 14.077 6.57703 14.2176 6.71764L15.9696 8.46964C16.1102 8.61028 16.1892 8.80101 16.1892 8.99989C16.1892 9.19876 16.1102 9.38949 15.9696 9.53014L14.2176 11.2821C14.077 11.4227 13.8863 11.5017 13.6874 11.5017C13.4885 11.5017 13.2978 11.4227 13.1571 11.2821L11.4051 9.53014C11.2645 9.38949 11.1855 9.19876 11.1855 8.99989C11.1855 8.80101 11.2645 8.61028 11.4051 8.46964Z"])</script>
3<script>self.__next_f.push([1,"39:[\"$\",\"section\",null,{\"className\":\"mt-20 overflow-hidden\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative mx-auto w-full max-w-[1456px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"col-start-2 w-full max-w-[1600px] min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"p-5 pt-10 sm:p-10 sm:pt-20\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full max-w-[800px]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-4\",\"children\":[\"$\",\"span\",null,{\"className\":\"inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium text-tg-text-color-secondary\",\"style\":{\"boxShadow\":\"0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset\"},\"children\":[[\"$\",\"svg\",null,{\"className\":\"size-4.5\",\"viewBox\":\"0 0 18 18\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"$46\",\"stroke\":\"currentColor\",\"strokeWidth\":\"1.3\",\"strokeLinejoin\":\"round\"}]}],\"Components\"]}]}],[\"$\",\"h2\",null,{\"className\":\"mb-4.5 text-2xl font-medium -tracking-[1.5px] text-tg-title-color sm:text-3xl md:text-4xl lg:text-[40px]/[48px] max-w-[600px] w-full\",\"children\":\"600+ UI Components and Blocks to Build Faster\"}],[\"$\",\"div\",null,{\"className\":\"text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base md:text-lg *:[\u0026\u003estrong]:font-medium *:[\u0026\u003estrong]:text-tg-title-color\",\"children\":\"$L47\"}]]}]}],\"$L48\",\"$L49\"]}],\"$L4a\",\"$L4b\"]}]}]}]\n"])</script>
3<script>self.__next_f.push([1,"4c:T715,"])</script>
3<script>self.__next_f.push([1,"M8.37109 2.18945C8.61822 2.1896 8.84459 2.33022 8.9541 2.55176L10.752 6.19531L14.7734 6.78027C15.0181 6.81596 15.2214 6.98752 15.2979 7.22266C15.3742 7.45777 15.3106 7.71597 15.1338 7.88867L12.2236 10.7256L12.9111 14.7295C12.9529 14.9731 12.8521 15.2198 12.6523 15.3652C12.4522 15.5106 12.1867 15.53 11.9678 15.415L8.37109 13.5234L4.77441 15.415C4.55551 15.53 4.28994 15.5105 4.08984 15.3652C3.88997 15.2198 3.79024 14.9732 3.83203 14.7295L4.51758 10.7256L1.6084 7.88867C1.43148 7.71599 1.36796 7.45781 1.44434 7.22266C1.52084 6.9876 1.72414 6.81593 1.96875 6.78027L5.98926 6.19531L7.78809 2.55176L7.83496 2.47266C7.95496 2.29754 8.15492 2.18951 8.37109 2.18945ZM7.00488 7.07812C6.91028 7.26959 6.72691 7.40264 6.51562 7.43359L3.45898 7.87695L5.6709 10.0332C5.82369 10.1824 5.89344 10.3979 5.85742 10.6084L5.33496 13.6514L8.06836 12.2148L8.1416 12.1816C8.31417 12.1166 8.50837 12.1279 8.67383 12.2148L11.4062 13.6514L10.8848 10.6084C10.8487 10.3976 10.9191 10.1825 11.0723 10.0332L13.2832 7.87695L10.2275 7.43359C10.016 7.40286 9.83303 7.26969 9.73828 7.07812L8.37109 4.30859L7.00488 7.07812ZM15.3809 3.78418C15.6347 3.53045 16.047 3.53041 16.3008 3.78418C16.5543 4.03799 16.5544 4.45035 16.3008 4.7041L15.1758 5.8291C14.9221 6.08279 14.5097 6.08258 14.2559 5.8291C14.0022 5.57528 14.0021 5.16299 14.2559 4.90918L15.3809 3.78418ZM15.2119 0.771484C15.4657 0.517932 15.8781 0.517971 16.1318 0.771484C16.3856 1.02528 16.3855 1.43757 16.1318 1.69141L12.835 4.9873C12.5811 5.24112 12.1689 5.24117 11.915 4.9873C11.6616 4.73344 11.6614 4.32206 11.915 4.06836L15.2119 0.771484ZM11.6367 1.16406C11.8905 0.910725 12.3019 0.910727 12.5557 1.16406C12.8095 1.41788 12.8095 1.83013 12.5557 2.08398L11.4316 3.20898C11.1779 3.46276 10.7656 3.46264 10.5117 3.20898C10.2581 2.95524 10.2582 2.54387 10.5117 2.29004L11.
36367 1.16406Z"])</script>
3<script>self.__next_f.push([1,"3b:[\"$\",\"section\",null,{\"className\":\"overflow-hidden\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative mx-auto w-full max-w-[1456px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"col-start-2 w-full max-w-[1600px] min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"p-5 pt-10 sm:p-10 sm:pt-20\",\"children\":[\"$\",\"div\",null,{\"className\":\"w-full max-w-[800px]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-4\",\"children\":[\"$\",\"span\",null,{\"className\":\"inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium text-tg-text-color-secondary\",\"style\":{\"boxShadow\":\"0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset\"},\"children\":[[\"$\",\"svg\",null,{\"className\":\"size-4.5\",\"viewBox\":\"0 0 18 18\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"$4c\",\"fill\":\"currentColor\"}]}],\"Testimonials\"]}]}],[\"$\",\"h2\",null,{\"className\":\"mb-4.5 text-2xl font-medium -tracking-[1.5px] text-tg-title-color sm:text-3xl md:text-4xl lg:text-[40px]/[48px] max-w-[540px] w-full\",\"children\":\"Wall of Love from Teams Building with Tailgrids\"}],[\"$\",\"div\",null,{\"className\":\"text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base md:text-lg *:[\u0026\u003estrong]:font-medium *:[\u0026\u003estrong]:text-tg-title-color\",\"children\":\"$L4d\"}]]}]}],\"$L4e\",\"$L4f\"]}],\"$L50\",\"$L51\"]}]}]}]\n"])</script>
3<script>self.__next_f.push([1,"52:T4e1,M14.7271 3.76687C13.6435 3.2681 12.499 2.91407 11.3231 2.71387C11.1631 3.00387 11.0177 3.30087 10.8871 3.60487C9.63489 3.41499 8.36125 3.41499 7.10907 3.60487C6.97853 3.30118 6.83302 3.00415 6.67307 2.71487C5.49628 2.91657 4.35091 3.27124 3.26607 3.76987C1.11207 6.97387 0.528069 10.0989 0.820069 13.1789C2.08069 14.1153 3.49293 14.828 4.99507 15.2859C5.33374 14.8279 5.63174 14.3445 5.88907 13.8359C5.40107 13.6521 4.92996 13.4262 4.48107 13.1609C4.59974 13.0742 4.71474 12.9872 4.82607 12.8999C6.13095 13.5172 7.55652 13.8374 9.00007 13.8374C10.4436 13.8374 11.8692 13.5172 13.1741 12.8999C13.2874 12.9932 13.4024 13.0799 13.5191 13.1599C13.0677 13.4272 12.5977 13.6532 12.1091 13.8379C12.3657 14.3459 12.6634 14.8285 13.0021 15.2859C14.5059 14.8305 15.9195 14.118 17.1801 13.1799C17.5231 9.60787 16.5951 6.51187 14.7271 3.76687ZM6.26007 11.2849C5.44607 11.2849 4.77407 10.5419 4.77407 9.62887C4.77407 8.71587 5.42307 7.96687 6.25707 7.96687C7.09107 7.96687 7.75907 8.71587 7.74507 9.62887C7.73107 10.5419 7.08907 11.2849 6.26007 11.2849ZM11.7421 11.2849C10.9271 11.2849 10.2571 10.5419 10.2571 9.62887C10.2571 8.71587 10.9071 7.96687 11.7421 7.96687C12.5771 7.96687 13.2401 8.71587 13.2251 9.62887C13.2101 10.5419 12.5711 11.2849 11.7421 11.2849Z"])</script>
3<script>self.__next_f.push([1,"3c:[\"$\",\"div\",null,{\"className\":\"mb-20\",\"children\":[\"$\",\"section\",null,{\"className\":\"overflow-hidden bg-gray-950\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative mx-auto w-full max-w-[1456px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-gray-950 [--pattern-fg:var(--border-2)]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"col-start-2 w-full max-w-[1600px] min-w-0\",\"children\":[\"$\",\"div\",null,{\"className\":\"py-14 lg:py-20\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-2)]\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-col items-center gap-4 xl:grid xl:grid-cols-12\",\"children\":[[\"$\",\"div\",null,{\"className\":\"pt-5 xl:col-span-4 xl:py-0 xl:pl-10\",\"children\":[\"$\",\"h2\",null,{\"className\":\"text-center font-mono text-2xl leading-10 font-[106] tracking-[-2px] text-white sm:text-4xl xl:text-left\",\"children\":\"Tailgrids Community\"}]}],[\"$\",\"div\",null,{\"className\":\"relative xl:col-span-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) left-0 w-px [--pattern-fg:var(--border-2)] top-1/2 hidden h-[200vh] -translate-y-1/2 max-lg:hidden xl:block\"}],[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-2)] hidden xl:hidden\"}],[\"$\",\"p\",null,{\"className\":\"mb-3 max-w-md px-5 text-center text-base tracking-[-0.2px] text-gray-300 sm:pl-10 lg:pl-7 xl:mb-0 xl:max-w-full xl:text-left\",\"children\":\"Join our Discord to stay up to date with the latest updates, releases, and offers.\"}]]}],[\"$\",\"div\",null,{\"className\":\"relative flex px-5 pb-5 xl:col-span-4 xl:justify-end xl:px-3 xl:py-3\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) left-0 w-px [--pattern-fg:var(--border-2)] top-1/2 hidden h-[200vh] -translate-y-1/2 max-lg:hidden xl:block\"}],[\"$\",\"a\",null,{\"href\":\"https://pimjo.com/community\",\"className\":\"inline-flex h-11 cursor-pointer items-center justify-center gap-2 rounded-xl px-4.5 text-sm font-medium duration-200 focus-visible:outline-none disabled:pointer-events-none bg-primary-500 hover:bg-primary-600 text-white shadow-primary-button\",\"aria-label\":\"$undefined\",\"aria-disabled\":false,\"aria-busy\":false,\"ref\":\"$undefined\",\"children\":[false,[[\"$\",\"svg\",null,{\"className\":\"size-5 shrink-0\",\"viewBox\":\"0 0 18 18\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"$52\",\"fill\":\"currentColor\"}]}],\"Join Our Discord Community\"]]}]]}]]}],\"$L53\"]}]}]}],\"$L54\",\"$L55\"]}]}]}]}]\n"])</script>
3<script>self.__next_f.push([1,"56:I[866823,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n5e:I[996985,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n3e:[\"$\",\"div\",null,{\"className\":\"p-4.5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-lg font-medium sm:text-xl\",\"children\":\"100+ Free UI Components\"}],[\"$\",\"p\",null,{\"className\":\"line-clamp-2 text-sm text-tg-text-color-secondary xs:text-base\",\"children\":\"Open-source React and Tailwind components for fast, consistent UI development.\"}]]}]\n"])</script>
3<script>self.__next_f.push([1,"3f:[\"$\",\"div\",\"2\",{\"className\":\"col-span-6 md:col-span-3 lg:col-span-2\",\"children\":[\"$\",\"a\",null,{\"target\":\"_blank\",\"href\":\"https://tailgrids.com/docs/installation#pick-your-framework\",\"className\":\"block cursor-pointer rounded-2xl border border-transparent bg-white p-2.5 transition hover:border-tg-border-1 hover:bg-gray-50\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-1.5 flex aspect-video items-center justify-center rounded-lg bg-white\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/image-5.11m7ej4sp.iv3.png\",\"width\":1221,\"height\":780,\"blurWidth\":8,\"blurHeight\":5,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAsElEQVR42gGlAFr/AAAAAAAKCgoJc258eSMiJSMlJCUlbm1ueAkJCQgAAAAAAAMDAwMdHR0bXFphSzk7RTM8PUYzWllaShwcHBoCAgICABoaGheMkpSMNzpEHnuKzol/js2GOTtEIJCLjIwXFxcUAAYGBgMnKCgcTU9YSWJzyzVldsw2VldgSScmJxsFBQUDAAAAAAAMDAwJcHBwezU3QCM6PEQmfX19egsLCwgAAAAA+tsjcl5aH9UAAAAASUVORK5CYII=\"},\"alt\":\"Use with every React framework\",\"className\":\"rounded-lg object-cover\",\"quality\":100}]}],[\"$\",\"div\",null,{\"className\":\"p-4.5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-lg font-medium sm:text-xl\",\"children\":\"Use with every React framework\"}],[\"$\",\"p\",null,{\"className\":\"line-clamp-2 text-sm text-tg-text-color-secondary xs:text-base\",\"children\":\"Scalable design system enabling flexible, framework-agnostic UI development.\"}]]}]]}]}]\n"])</script>
3<script>self.__next_f.push([1,"41:[\"$\",\"div\",null,{\"className\":\"relative bg-gray-950 p-5 sm:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-2)]\"}],[\"$\",\"div\",null,{\"className\":\"columns-1 gap-2 md:columns-2 xl:columns-3\",\"children\":[[\"$\",\"$1\",\"0\",{\"children\":[\"$\",\"$L56\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/core-feature-1.0djlf1_7v.r9t.png\",\"width\":854,\"height\":440,\"blurWidth\":8,\"blurHeight\":4,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAECAYAAACzzX7wAAAAWklEQVR42i2NWQ6AIAxEOYKyylpRo+j9z0el1Y+XSdpZxKQKErMGVLaiNCurdtugdkEP63f06cQlfoTcMJY29OqC0uSmY4KbyfCw+vQbCGkAXTi4gRopNKb6C51iKhKpxoFlAAAAAElFTkSuQmCC\"},\"alt\":\"600+ UI Building Blocks and Components\",\"className\":\"rounded-lg object-cover\"}]}],[\"$\",\"div\",null,{\"className\":\"p-5 xs:p-8\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg\",\"children\":\"600+ UI Building Blocks and Components\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-gray-400 xs:text-base\",\"children\":\"Production-ready, framework-agnostic UI building blocks, components, layouts, and scalable interface patterns for modern applications.\"}]]}]]}]}]}],[\"$\",\"$1\",\"1\",{\"children\":[\"$\",\"$L56\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/core-feature-2.0-tjbox8gthse.png\",\"width\":854,\"height\":512,\"blurWidth\":8,\"blurHeight\":5,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAVUlEQVR42n2NOQ6AMBAD8wNCDiKu3aWIAh3/fxwmKxpQJIqRXIxtYz3hh8to6AMjTRnjUhDS1gouCmbakcsJkgN+kK/wrBB8pLrAtcCtoHRuhVVeFzc0SDLZokqrIgAAAABJRU5ErkJggg==\"},\"alt\":\"Styled with Tailwind CSS\",\"className\":\"rounded-lg object-cover\"}]}],[\"$\",\"div\",null,{\"className\":\"p-5 xs:p-8\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg\",\"children\":\"Styled with Tailwind CSS\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-gray-400 xs:text-base\",\"children\":\"Built with the latest Tailwind CSS for utility-first styling, theming, rapid iteration, and scalable UI development.\"}]]}]]}]}]}],[\"$\",\"$1\",\"2\",{\"children\":[\"$\",\"$L56\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/core-feature-3.0x.fq7susy25p.png\",\"width\":854,\"height\":480,\"blurWidth\":8,\"blurHeight\":4,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAECAYAAACzzX7wAAAAVUlEQVR42nWNSw6AIAxEOYIKCAEt4ieGeP/rMbYY48rFpG368kb1JuEvnaaqBrvAx6PF+g0ufDtDVekxI1IB5YufO8J8YkoFxq0PICo5BBTbO1nfKm5/NSl2xX7gdAAAAABJRU5ErkJggg==\"},\"alt\":\"Light and Dark Theme Support\",\"className\":\"rounded-lg object-cover\"}]}],[\"$\",\"div\",null,{\"className\":\"p-5 xs:p-8\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg\",\"children\":\"Light and Dark Theme Support\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-gray-400 xs:text-base\",\"children\":\"Built-in light and dark themes across all components, aligned with system preferences and consistent UI behavior.\"}]]}]]}]}]}],[\"$\",\"$1\",\"3\",{\"children\":[\"$\",\"$L56\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center\",\"children\":\"$L57\"}],\"$L58\"]}]}]}],\"$L59\",\"$L5a\",\"$L5b\",\"$L5c\",\"$L5d\"]}]]}]\n"])</script>
3<script>self.__next_f.push([1,"42:[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)] -mb-px\"}]\n43:[\"$\",\"div\",null,{\"className\":\"relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n44:[\"$\",\"div\",null,{\"className\":\"relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n47:[\"$\",\"p\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"Each component and block ships with a full Figma source and production-ready code, ensuring consistent design-to-development workflows at scale.\"}}]\n"])</script>
3<script>self.__next_f.push([1,"48:[\"$\",\"div\",null,{\"className\":\"relative bg-gray-100 p-5 sm:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"$L5e\",null,{\"data\":\"$undefined\",\"categoriesWithTags\":[{\"_id\":\"69660b7a98242a70ab20381d\",\"name\":\"Application UI Blocks\",\"description\":\"Build a complete React app with our collection of stunning Tailwind UI components designed specifically for web apps. The Tailgrids Application UI includes blogs, cards, modals, tables, file uploads, notifications, paywalls, error pages, and more. Designed for SaaS platforms, apps, and products requiring scalable, structured interfaces.\",\"slug\":\"application\",\"sortingOrder\":0,\"label\":\"\",\"iconUrl\":\"https://assets.tailgrids.com/1768295785117-application.svg\",\"createdAt\":\"2026-01-13T09:08:10.509Z\",\"updatedAt\":\"2026-01-20T07:47:05.246Z\",\"tags\":[{\"slug\":\"/blocks/blog-sections\",\"_id\":\"696616ee5cca32c806bed6af\",\"name\":\"Blog Sections\",\"sortOrder\":1,\"shortDescription\":\"12 Components\",\"description\":\"Blog blocks help us make structured blog layouts right inside of apps. They are designed for product updates, changelogs, and technical content, with clear content hierarchy, metadata placement, and responsive behavior. These blocks make it easy to scale content without breaking layout consistency.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768298214335-blog-grid.png\",\"alt\":\"Blog\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-13T09:57:02.084Z\",\"updatedAt\":\"2026-01-25T10:52:08.312Z\"},{\"slug\":\"/blocks/blog-details\",\"_id\":\"69670e6d17abd30e2694215b\",\"name\":\"Blog Details\",\"sortOrder\":1,\"shortDescription\":\"4 Components\",\"description\":\"Blog detail blocks focus on long-form reading inside real products. They handle typography, spacing, author details, and supporting metadata while keeping the layout distraction-free. Ideal for technical posts, release notes, and documentation-style articles that require clarity and consistency.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768361556140-blog-details.png\",\"alt\":\"Blog Details\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T03:33:01.895Z\",\"updatedAt\":\"2026-01-14T03:33:01.895Z\"},{\"slug\":\"/blocks/bento-grids\",\"_id\":\"6967132d17abd30e269421b3\",\"name\":\"Bento Grids\",\"sortOrder\":1,\"shortDescription\":\"4 Components\",\"description\":\"Bento grid blocks let us present multiple features, metrics, or content sections in a compact, modern layout. They are optimized for dashboards and landing sections where visual grouping and hierarchy matter, without sacrificing flexibility or responsiveness across screen sizes.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768362791453-bento-grids.png\",\"alt\":\"Bento Grids\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T03:53:17.152Z\",\"updatedAt\":\"2026-01-14T03:53:17.152Z\"},{\"slug\":\"/blocks/cards\",\"_id\":\"6967147c17abd30e269421f7\",\"name\":\"Cards\",\"sortOrder\":1,\"shortDescription\":\"13 Components\",\"description\":\"Card blocks are modular building units for application interfaces. They help group content, actions, and data in a predictable layout, making them ideal for dashboards, listings, and feature sections where reusability and visual consistency are critical.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768363047718-cards.png\",\"alt\":\"Cards\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T03:58:52.106Z\",\"updatedAt\":\"2026-01-14T03:58:52.106Z\"},{\"slug\":\"/blocks/contact\",\"_id\":\"6967157417abd30e2694221c\",\"name\":\"Contact\",\"sortOrder\":1,\"shortDe
3scription\":\"7 Components\",\"description\":\"Contact blocks are built for real application use cases like support requests, sales inquiries, and onboarding communication. They focus on clear form structure, accessible inputs, and responsive layouts to ensure users can reach teams quickly and without friction.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768363296386-contact.png\",\"alt\":\"Contact\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T04:03:00.836Z\",\"updatedAt\":\"2026-01-26T06:31:19.056Z\"},{\"slug\":\"/blocks/cookies\",\"_id\":\"69673a990f12aefda2f4dc6f\",\"name\":\"Cookies\",\"sortOrder\":1,\"shortDescription\":\"5 Components\",\"description\":\"Cookie blocks help manage consent and privacy preferences inside applications. They present required information clearly while fitting naturally into modern UI layouts. These blocks support compliance needs without interrupting user experience or visual consistency.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768372875987-cookies.png\",\"alt\":\"Cookies\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T06:41:29.475Z\",\"updatedAt\":\"2026-01-14T06:41:29.475Z\"},{\"slug\":\"/blocks/error-page\",\"_id\":\"69673d660f12aefda2f4dd9c\",\"name\":\"Error Page\",\"sortOrder\":1,\"shortDescription\":\"5 Components\",\"description\":\"Error page blocks provide structured layouts for handling common error states like 404 and access issues. They combine clear messaging with recovery actions, helping users understand what went wrong and guiding them back to relevant parts of the product.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768373598425-error-page.png\",\"alt\":\"Error Page\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T06:53:26.336Z\",\"updatedAt\":\"2026-01-14T06:53:26.336Z\"},{\"slug\":\"/blocks/mega-menu\",\"_id\":\"69675a6417e4399952f4aac2\",\"name\":\"Mega Menu\",\"sortOrder\":1,\"shortDescription\":\"4 Components\",\"description\":\"Mega menu blocks are designed for products with large navigation systems. They help organize features, pages, and resources into clear, scannable layouts\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381015239-mega-menu.png\",\"alt\":\"Mega Menu\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T08:57:08.232Z\",\"updatedAt\":\"2026-01-14T08:57:08.232Z\"},{\"slug\":\"/blocks/modals\",\"_id\":\"69675d4b17e4399952f4abc0\",\"name\":\"Modals\",\"sortOrder\":1,\"shortDescription\":\"8 Components\",\"description\":\"Modal blocks support focused interactions such as confirmations, forms, and inline workflows. They are designed for predictable behavior, accessibility, and smooth user flow, helping users complete tasks without losing context inside the application.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381764154-modals.png\",\"alt\":\"Modals\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:09:31.471Z\",\"updatedAt\":\"2026-01-14T09:09:31.471Z\"},{\"slug\":\"/blocks/auth\",\"_id\":\"6967611917e4399952f4ad77\",\"name\":\"Auth\",\"sortOrder\":1,\"shortDescription\":\"5 Components\",\"description\":\"Auth blocks cover essential authentication flows including login, signup, and verification. They help us build consistent entry points for users while maintaining accessibility, responsive layouts, and clear guidance across devices and application states.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768382738860-auth.png\",\"alt\":\"Auth\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:25:45.804Z\",\"updatedAt\":\"2026-01-14T09:25:45.804Z\"},{\"slug\":\"/blocks/gallery\",\"_id\":\"6967637a17e4399952f4ae9f\",\"name\":\"Gallery\",\"sortOrder\":1,\"shortDe
3scription\":\"7 Components\",\"description\":\"Gallery blocks provide structured layouts for displaying images and visual assets inside applications. They are suitable for product previews, media libraries, and portfolios, ensuring consistent spacing, alignment, and responsive behavior across different screen sizes.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383351291-gallery.png\",\"alt\":\"Gallery\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:35:54.945Z\",\"updatedAt\":\"2026-01-14T09:35:54.945Z\"},{\"slug\":\"/blocks/tables\",\"_id\":\"6967662217e4399952f4b003\",\"name\":\"Tables\",\"sortOrder\":1,\"shortDescription\":\"6 Components\",\"description\":\"Table blocks are built for displaying structured data inside dashboards and admin panels. They focus on readability and layout clarity, making it easier for users to scan, compare, and understand data-heavy interfaces.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768384030736-tables.png\",\"alt\":\"Tables\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:47:14.989Z\",\"updatedAt\":\"2026-01-14T09:47:14.989Z\"},{\"slug\":\"/blocks/search-modal\",\"_id\":\"69676730fbcbd027dc9f01fc\",\"name\":\"Search Modal\",\"sortOrder\":13,\"shortDescription\":\"6 Components\",\"description\":\"Search modal blocks enable fast in-app search experiences. They help users quickly find pages, data, or features without navigating away, supporting keyboard interaction and clean layouts for large products and documentation-driven platforms.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768384300465-search-modal.png\",\"alt\":\"Search Modal\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:51:44.960Z\",\"updatedAt\":\"2026-01-14T09:51:44.960Z\"},{\"slug\":\"/blocks/paywall\",\"_id\":\"6967675bfbcbd027dc9f0217\",\"name\":\"Paywall\",\"sortOrder\":14,\"shortDe
3scription\":\"5 Components\",\"description\":\"Paywall blocks help manage gated access to features or content. They clearly communicate restrictions, benefits, and upgrade paths, making them suitable for SaaS products and subscription-based applications where value needs to be explained before access.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768384345331-paywall.png\",\"alt\":\"Paywall\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:52:27.388Z\",\"updatedAt\":\"2026-01-14T09:52:27.388Z\"},{\"slug\":\"/blocks/notification\",\"_id\":\"69676793fbcbd027dc9f0238\",\"name\":\"Notification\",\"sortOrder\":16,\"shortDescription\":\"4 Components \",\"description\":\"Notification blocks are designed to surface system messages, alerts, and updates clearly. They help deliver important information without overwhelming users, supporting both real-time feedback and persistent notifications inside applications.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768384379002-notification.png\",\"alt\":\"Notification\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:53:23.305Z\",\"updatedAt\":\"2026-01-14T09:53:23.305Z\"},{\"slug\":\"/blocks/file-upload\",\"_id\":\"696767b8fbcbd027dc9f0253\",\"name\":\"File Upload\",\"sortOrder\":14,\"shortDe
3scription\":\"5 Components\",\"description\":\"File upload blocks provide clear interfaces for handling uploads inside applications. They support drag-and-drop interactions, progress indicators, and error handling, making them suitable for forms, dashboards, and content management workflows.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768384431455-file-upload.png\",\"alt\":\"File Upload\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:54:00.245Z\",\"updatedAt\":\"2026-01-14T09:54:00.245Z\"},{\"slug\":\"/blocks/forms-layout\",\"_id\":\"69721cac243e6751d531ef1f\",\"name\":\"Forms Layout\",\"sortOrder\":1,\"shortDescription\":\"4 Components\",\"description\":\" A complete set of authentication and contact forms including contact forms with subject selection and phone input, plus sign-up and login forms with Google/Apple social authentication options.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1769085816204-Thumbnail.png\",\"alt\":\"Forms Layout\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-22T12:48:44.223Z\",\"updatedAt\":\"2026-01-22T12:59:51.430Z\"},{\"slug\":\"/blocks/login-signup\",\"_id\":\"69f725df38997a6d424d436c\",\"name\":\"Login Signup\",\"sortOrder\":16,\"shortDescription\":\"5 Components\",\"description\":\"This collection provides a versatile range of high-conversion authentication layoutsâincluding split-screen, dark-themed, and minimalist centered designsâfully standardized with core UI components to ensure accessible, consistent, and professional onboarding experiences.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660b7a98242a70ab20381d\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1777804605216-login-signup-.png\",\"alt\":\"Login Signup\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-05-03T10:39:27.704Z\",\"updatedAt\":\"2026-05-03T10:39:27.704Z\"}]},{\"_id\":\"69660c8a98242a70ab203824\",\"name\":\"Marketing UI Blocks\",\"description\":\"Transform visitors into customers with our React Marketing UI Blocks. Empower your React apps with these UI blocks and sections crafted for product, offer, or app promotion. Includes navbars, hero sections, feature sections, pricing tables, testimonials, CTAs, and more. Ideal for converting visitors into users across SaaS, startup, and business websites.\",\"slug\":\"marketing\",\"sortingOrder\":0,\"label\":\"\",\"iconUrl\":\"https://assets.tailgrids.com/1768295556349-marketing.svg\",\"createdAt\":\"2026-01-13T09:12:42.757Z\",\"updatedAt\":\"2026-01-20T08:30:02.763Z\",\"tags\":[{\"slug\":\"/blocks/about\",\"_id\":\"69676268fbcbd027dc9f0031\",\"name\":\"About\",\"sortOrder\":3,\"shortDescription\":\"8 Components\",\"description\":\"About blocks are designed to communicate product vision, company story, and team context clearly. They help present mission, values, and background information in a structured layout that builds trust without overwhelming users.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383050942-about.png\",\"alt\":\"About\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:31:20.359Z\",\"updatedAt\":\"2026-01-14T09:31:20.359Z\"},{\"slug\":\"/blocks/navbars\",\"_id\":\"696762adfbcbd027dc9f0058\",\"name\":\"Navbars\",\"sortOrder\":1,\"shortDescription\":\"7 Components\",\"description\":\"Navbar blocks help us build clear, scalable navigation for marketing websites and product landing pages. They support common patterns like multi-level menus, CTAs, and responsive layouts, making it easier to guide users across pages while maintaining consistency with the overall site structure.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383146799-navbar.png\",\"alt\":\"Navbars\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:32:29.538Z\",\"updatedAt\":\"2026-01-14T09:32:29.538Z\"},{\"slug\":\"/blocks/footers\",\"_id\":\"69676392fbcbd027dc9f007f\",\"name\":\"Footers\",\"sortOrder\":2,\"shortDe
3scription\":\"8 Components\",\"description\":\"Footer blocks provide structured layouts for links, product information, legal content, and secondary CTAs. They help organize supporting navigation and brand details in a clean, responsive format that works across marketing sites and product-focused pages.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383374414-footer.png\",\"alt\":\"Footers\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:36:18.236Z\",\"updatedAt\":\"2026-01-14T09:36:18.236Z\"},{\"slug\":\"/blocks/brands\",\"_id\":\"696763c1fbcbd027dc9f009a\",\"name\":\"Brands\",\"sortOrder\":4,\"shortDescription\":\"5 Components\",\"description\":\"Brand blocks help showcase logos, integrations, and partner relationships. They are commonly used to build credibility on landing pages by highlighting companies, tools, or platforms associated with the product in a clean and consistent layout.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383422869-brands.png\",\"alt\":\"Brands\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:37:05.533Z\",\"updatedAt\":\"2026-01-14T09:37:05.533Z\"},{\"slug\":\"/blocks/cta\",\"_id\":\"696763f2fbcbd027dc9f00bb\",\"name\":\"CTA\",\"sortOrder\":5,\"shortDescription\":\"7 Components \",\"description\":\"CTA blocks focus on guiding users toward key actions such as signups, demos, or upgrades. They are designed to stand out visually while fitting naturally into the page flow, helping improve conversions without disrupting content structure.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383466260-cta.png\",\"alt\":\"CTA\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:37:54.371Z\",\"updatedAt\":\"2026-01-14T09:37:54.371Z\"},{\"slug\":\"/blocks/features-and-services\",\"_id\":\"6967641ffbcbd027dc9f00dc\",\"name\":\"Features and Services\",\"sortOrder\":6,\"shortDescription\":\"9 Components\",\"description\":\"Feature and service blocks help us present product capabilities and offerings clearly. They organize information into scannable sections, making it easier for users to understand value, compare options, and move forward in the decision process.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383515574-features.png\",\"alt\":\"Features and Services\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:38:39.053Z\",\"updatedAt\":\"2026-01-14T09:38:39.053Z\"},{\"slug\":\"/blocks/hero-area\",\"_id\":\"69676448fbcbd027dc9f00f7\",\"name\":\"Hero Area\",\"sortOrder\":7,\"shortDescription\":\"11 Components\",\"description\":\"Hero area blocks define the first impression of a marketing page. They combine headline, supporting copy, and primary actions into a focused layout that communicates value quickly and sets context for the rest of the page.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383555931-hero.png\",\"alt\":\"Hero Area\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:39:20.333Z\",\"updatedAt\":\"2026-01-14T09:39:20.333Z\"},{\"slug\":\"/blocks/newsletter-forms\",\"_id\":\"6967647cfbcbd027dc9f0118\",\"name\":\"Newsletter\",\"sortOrder\":8,\"shortDescription\":\"6 Components\",\"description\":\"Newsletter blocks provide structured signup sections for updates and product communication. They focus on clarity, minimal input, and strong messaging, making it easier to grow email lists without adding friction to the user experience.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383610248-newsletter.png\",\"alt\":\"Newsletter\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:40:12.133Z\",\"updatedAt\":\"2026-01-22T06:05:40.342Z\"},{\"slug\":\"/blocks/portfolio\",\"_id\":\"696764b6fbcbd027dc9f013f\",\"name\":\"Portfolio\",\"sortOrder\":9,\"shortDe
3scription\":\"9 Components\",\"description\":\"Portfolio blocks help showcase projects, case studies, or work samples in a structured layout. They are suitable for agencies, products, and teams that want to highlight results, visuals, and outcomes clearly across marketing pages.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383651413-portfolio.png\",\"alt\":\"Portfolio\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:41:10.721Z\",\"updatedAt\":\"2026-01-14T09:41:10.721Z\"},{\"slug\":\"/blocks/pricing-tables\",\"_id\":\"6967658afbcbd027dc9f0172\",\"name\":\"Pricing Tables\",\"sortOrder\":10,\"shortDescription\":\"10 Components\",\"description\":\"Pricing table blocks present plans, features, and comparisons in a clear format. They help users evaluate options quickly by organizing pricing information, feature limits, and CTAs in a structured and readable layout.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383849234-pricing.png\",\"alt\":\"Pricing Tables\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:44:42.681Z\",\"updatedAt\":\"2026-01-14T09:44:42.681Z\"},{\"slug\":\"/blocks/stats\",\"_id\":\"696765c9fbcbd027dc9f0199\",\"name\":\"Stats\",\"sortOrder\":11,\"shortDescription\":\"5 Components\",\"description\":\"Stats blocks help highlight key metrics such as usage, growth, or performance. They are designed to present numbers clearly and build credibility by reinforcing product impact and adoption on marketing and landing pages.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383943508-stats.png\",\"alt\":\"Stats\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:45:45.117Z\",\"updatedAt\":\"2026-01-14T09:45:45.117Z\"},{\"slug\":\"/blocks/teams\",\"_id\":\"69676601fbcbd027dc9f01c0\",\"name\":\"Teams\",\"sortOrder\":12,\"shortDescription\":\"7 Components\",\"description\":\"Team blocks help introduce people behind the product or company. They present roles, profiles, and context in a structured layout, supporting transparency and trust across marketing and company-focused pages.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768383988922-teams.png\",\"alt\":\"Teams\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:46:41.575Z\",\"updatedAt\":\"2026-01-14T09:46:41.575Z\"},{\"slug\":\"/blocks/testimonials\",\"_id\":\"69676633fbcbd027dc9f01e1\",\"name\":\"Testimonials\",\"sortOrder\":13,\"shortDescription\":\"8 Components\",\"description\":\"Testimonial blocks showcase customer feedback and social proof. They help reinforce product value by presenting real user experiences in a clear, readable format that fits naturally into marketing and conversion-focused pages.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660c8a98242a70ab203824\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768384047859-testimonials.png\",\"alt\":\"Testimonials\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:47:31.861Z\",\"updatedAt\":\"2026-01-14T09:47:31.861Z\"}]},{\"_id\":\"69660cc898242a70ab20382b\",\"name\":\"eCommerce UI Blocks\",\"description\":\"Build an e-commerce website UI and site by simply copy-pasting components and blocks with 100+ React eCommerce UI kit components, elements, and pages. Includes product grids, category sections, filters, carousels, carts, wishlists, checkout flows, order summaries, reviews, and more, enabling fast customization and a smooth shopping experience across storefronts.\",\"slug\":\"e-commerce\",\"sortingOrder\":0,\"label\":\"\",\"iconUrl\":\"https://assets.tailgrids.com/1768295618125-ecommerce.svg\",\"createdAt\":\"2026-01-13T09:13:44.195Z\",\"updatedAt\":\"2026-01-20T08:30:25.765Z\",\"tags\":[{\"slug\":\"/blocks/banner\",\"_id\":\"69676832fbcbd027dc9f0274\",\"name\":\"Banner\",\"sortOrder\":1,\"shortDe
3scription\":\"5 Components \",\"description\":\"Banner blocks help highlight promotions, announcements, and seasonal offers across eCommerce pages. They are designed to draw attention without disrupting layout flow, making them suitable for homepages, category pages, and campaign-driven landing sections.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768384557880-banner.png\",\"alt\":\"Banner\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:56:02.322Z\",\"updatedAt\":\"2026-01-14T09:56:02.322Z\"},{\"slug\":\"/blocks/checkout\",\"_id\":\"69676857fbcbd027dc9f028f\",\"name\":\"Checkout\",\"sortOrder\":2,\"shortDescription\":\"6 Components\",\"description\":\"Checkout blocks provide structured layouts for completing purchases efficiently. They focus on clarity, form flow, and order visibility, helping reduce friction during payment and ensuring a smooth checkout experience across devices.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768384596213-checkout.png\",\"alt\":\"Checkout\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:56:39.342Z\",\"updatedAt\":\"2026-01-14T09:56:39.342Z\"},{\"slug\":\"/blocks/e-commerce-navbars\",\"_id\":\"69676b12fbcbd027dc9f02b0\",\"name\":\"E-Commerce Navbars\",\"sortOrder\":3,\"shortDescription\":\"7 Components\",\"description\":\"E-commerce navbar blocks are built for product-heavy stores with complex navigation needs. They support categories, search, cart access, and account actions, helping users move quickly between browsing and purchasing.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768385289816-e-commerce-nav.png\",\"alt\":\"E-Commerce Navbars\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:08:18.250Z\",\"updatedAt\":\"2026-01-14T10:08:18.250Z\"},{\"slug\":\"/blocks/e-commerce-hero-area\",\"_id\":\"69676b47fbcbd027dc9f02d7\",\"name\":\"E-Commerce Hero Area\",\"sortOrder\":4,\"shortDescription\":\"11 Components\",\"description\":\"E-commerce hero area blocks set context for product discovery and promotions. They combine messaging, visuals, and primary actions to guide users toward featured collections, offers, or seasonal campaigns from the first screen.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768385347312-e-commerce-hero.png\",\"alt\":\"E-Commerce Hero Area\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:09:11.305Z\",\"updatedAt\":\"2026-01-14T10:09:11.305Z\"},{\"slug\":\"/blocks/e-commerce-footer\",\"_id\":\"69676b74fbcbd027dc9f02fe\",\"name\":\"E-Commerce Footer\",\"sortOrder\":5,\"shortDescription\":\"6 Components\",\"description\":\"E-commerce footer blocks organize secondary navigation, trust signals, and store information. They help surface policies, support links, and brand details in a structured layout that supports usability and compliance needs.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768385394044-e-commerce-footer.png\",\"alt\":\"E-Commerce Footer\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:09:56.171Z\",\"updatedAt\":\"2026-01-14T10:09:56.171Z\"},{\"slug\":\"/blocks/featured-products\",\"_id\":\"69676b9cfbcbd027dc9f031f\",\"name\":\"Featured Products\",\"sortOrder\":6,\"shortDescription\":\"6 Components\",\"description\":\"Featured product blocks highlight selected items, collections, or promotions. They help guide attention toward priority products while maintaining consistent card layouts and responsive behavior across storefront pages.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768385433909-feature-product.png\",\"alt\":\"Featured Products\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:10:36.073Z\",\"updatedAt\":\"2026-01-14T10:10:36.073Z\"},{\"slug\":\"/blocks/filters\",\"_id\":\"69676bedfbcbd027dc9f033a\",\"name\":\"Filter\",\"sortOrder\":7,\"shortDe
3scription\":\"6 Components\",\"description\":\"Filter blocks help users narrow product listings by category, price, attributes, or availability. They are designed to support fast browsing and decision-making in stores with large or complex product catalogs.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768385513035-filter.png\",\"alt\":\"Filter\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:11:57.508Z\",\"updatedAt\":\"2026-01-22T04:52:24.884Z\"},{\"slug\":\"/blocks/order-summaries\",\"_id\":\"69676c15fbcbd027dc9f0355\",\"name\":\"Order Summaries\",\"sortOrder\":8,\"shortDescription\":\"6 Components\",\"description\":\"Order summary blocks present selected items, pricing, and totals clearly. They help users review purchases before checkout, reinforcing transparency and reducing errors during the buying process.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768385554737-order-summary.png\",\"alt\":\"Order Summaries\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:12:37.476Z\",\"updatedAt\":\"2026-01-14T10:12:37.476Z\"},{\"slug\":\"/blocks/product-reviews\",\"_id\":\"69676c59fbcbd027dc9f0376\",\"name\":\"Product Reviews\",\"sortOrder\":9,\"shortDescription\":\"6 Components\",\"description\":\"Product review blocks display ratings, feedback, and customer opinions. They help build trust by presenting social proof in a clear layout that supports comparison and informed purchasing decisions.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768385622499-product-review.png\",\"alt\":\"Product Reviews\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:13:45.143Z\",\"updatedAt\":\"2026-01-14T10:13:45.143Z\"},{\"slug\":\"/blocks/product-carousels\",\"_id\":\"69676c7cfbcbd027dc9f0391\",\"name\":\"Product Carousels\",\"sortOrder\":10,\"shortDescription\":\"6 Components \",\"description\":\"Product carousel blocks allow horizontal browsing of items and collections. They help surface related or recommended products while keeping users engaged without leaving the current page context.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768385657487-product-carousel.png\",\"alt\":\"Product Carousels\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:14:20.317Z\",\"updatedAt\":\"2026-01-14T10:14:20.317Z\"},{\"slug\":\"/blocks/product-details\",\"_id\":\"69676ca4fbcbd027dc9f03ac\",\"name\":\"Product Details\",\"sortOrder\":11,\"shortDescription\":\"7 Components\",\"description\":\"Product detail blocks provide structured layouts for showcasing individual products. They organize images, descriptions, pricing, and actions clearly, helping users understand value and make confident purchase decisions.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768385697533-product-details.png\",\"alt\":\"Product Details\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:15:00.415Z\",\"updatedAt\":\"2026-01-14T10:15:00.415Z\"},{\"slug\":\"/blocks/product-grids\",\"_id\":\"69676fe8fbcbd027dc9f03d9\",\"name\":\"Product Grids\",\"sortOrder\":13,\"shortDescription\":\"8 Components\",\"description\":\"Product grid blocks display multiple items in a clean, scannable layout. They support browsing, comparison, and discovery across category pages while maintaining consistent spacing and responsive behavior.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768386523644-product-grids.png\",\"alt\":\"Product Grids\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:28:56.524Z\",\"updatedAt\":\"2026-01-14T10:28:56.524Z\"},{\"slug\":\"/blocks/product-categories\",\"_id\":\"6967708dfbcbd027dc9f0400\",\"name\":\"Product Categories\",\"sortOrder\":13,\"shortDe
3scription\":\"6 Components\",\"description\":\"Product category blocks help group and highlight collections within a store. They guide users toward relevant sections of the catalog, improving navigation and product discovery across the shopping experience.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768386681831-product-categories.png\",\"alt\":\"Product Categories\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:31:41.441Z\",\"updatedAt\":\"2026-01-14T10:31:41.441Z\"},{\"slug\":\"/blocks/quick-views\",\"_id\":\"696770c9fbcbd027dc9f041b\",\"name\":\"Quick Views\",\"sortOrder\":14,\"shortDescription\":\"5 Components\",\"description\":\"Quick view blocks allow users to preview product details without leaving the current page. They help reduce navigation friction and speed up browsing in product-heavy storefronts.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768386756408-quick-views.png\",\"alt\":\"Quick Views\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:32:41.271Z\",\"updatedAt\":\"2026-01-14T10:32:41.271Z\"},{\"slug\":\"/blocks/shopping-cart\",\"_id\":\"696772bdfbcbd027dc9f043c\",\"name\":\"Shopping Cart\",\"sortOrder\":16,\"shortDescription\":\"5 Components\",\"description\":\"Shopping cart blocks present selected items, quantities, and totals clearly. They help users review and update purchases before checkout while maintaining a predictable and user-friendly flow.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768387256403-cart.png\",\"alt\":\"Shopping Cart\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:41:01.065Z\",\"updatedAt\":\"2026-01-14T10:41:01.065Z\"},{\"slug\":\"/blocks/wishlist\",\"_id\":\"696772eafbcbd027dc9f0457\",\"name\":\"Wishlist\",\"sortOrder\":17,\"shortDescription\":\"4 Components\",\"description\":\"Wishlist blocks allow users to save products for later consideration. They support browsing continuity and repeat visits by helping users track preferred items across sessions and devices.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660cc898242a70ab20382b\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768387300543-wishlist.png\",\"alt\":\"Wishlist\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T10:41:46.094Z\",\"updatedAt\":\"2026-01-14T10:41:46.094Z\"}]},{\"_id\":\"69660d0e98242a70ab203832\",\"name\":\"Dashboard UI Blocks\",\"description\":\"Build a robust, data-rich admin dashboard for your web application using React dashboard UI components. This collection includes graphs, charts, tables, widgets, stats, calendars, maps, sidebars, and ready-to-use admin and dashboard templates. Everything you need for analytics dashboards, admin panels, and a powerful backend solution.\",\"slug\":\"dashboard\",\"sortingOrder\":0,\"label\":\"\",\"iconUrl\":\"https://assets.tailgrids.com/1768295691216-dashbord.svg\",\"createdAt\":\"2026-01-13T09:14:54.302Z\",\"updatedAt\":\"2026-01-20T08:30:39.502Z\",\"tags\":[{\"slug\":\"/blocks/charts\",\"_id\":\"6967428de6abfd4e72ebb3fa\",\"name\":\"Charts\",\"sortOrder\":1,\"shortDescription\":\"7 Components \",\"description\":\"Chart blocks help visualize data clearly inside dashboards. They support common chart patterns used in analytics and admin panels, making it easier to communicate trends, comparisons, and performance metrics without building visualization layouts from scratch.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768374921452-chart.png\",\"alt\":\"Charts\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T07:15:25.993Z\",\"updatedAt\":\"2026-01-14T07:15:25.993Z\"},{\"slug\":\"/blocks/chat-boxes\",\"_id\":\"69675b11fbcbd027dc9efe3f\",\"name\":\"Chat Boxes\",\"sortOrder\":2,\"shortDe
3scription\":\"7 Components\",\"description\":\"Chat box blocks provide structured layouts for real-time messaging and support interfaces. They handle message flow, input areas, and conversation context, making them suitable for in-app chat, customer support, and collaboration tools.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381195848-chatbox.png\",\"alt\":\"Chat Boxes\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:00:01.282Z\",\"updatedAt\":\"2026-01-14T09:00:27.220Z\"},{\"slug\":\"/blocks/chat-list\",\"_id\":\"69675b73fbcbd027dc9efe6c\",\"name\":\"Chat List\",\"sortOrder\":3,\"shortDescription\":\"3 Components\",\"description\":\"Chat list blocks organize conversations and contacts in a clear, scannable format. They help users quickly identify active chats, recent messages, and unread states in messaging or support-focused dashboard applications.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381295909-chatlist.png\",\"alt\":\"Chat List\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:01:39.076Z\",\"updatedAt\":\"2026-01-14T09:01:39.076Z\"},{\"slug\":\"/blocks/calendars\",\"_id\":\"69675ba6fbcbd027dc9efe87\",\"name\":\"Calendars\",\"sortOrder\":4,\"shortDescription\":\"1 Components\",\"description\":\"Calendar blocks support scheduling, planning, and time-based views inside dashboards. They provide clear layouts for events and timelines, making them suitable for booking systems, task planning, and product scheduling interfaces.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381336291-calendar.png\",\"alt\":\"Calendars\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:02:30.425Z\",\"updatedAt\":\"2026-01-14T09:02:30.425Z\"},{\"slug\":\"/blocks/data-stats\",\"_id\":\"69675bdefbcbd027dc9efea8\",\"name\":\"Data Stats\",\"sortOrder\":5,\"shortDescription\":\"10 Components\",\"description\":\"Data stats blocks highlight key metrics and performance indicators at a glance. They are designed for dashboards where quick insight matters, helping users track growth, usage, and operational data without navigating deeper reports.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381402400-data-stats.png\",\"alt\":\"Data Stats\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:03:26.850Z\",\"updatedAt\":\"2026-01-14T09:03:26.850Z\"},{\"slug\":\"/blocks/drawers\",\"_id\":\"69675c27fbcbd027dc9efec9\",\"name\":\"Drawers\",\"sortOrder\":6,\"shortDescription\":\"4 Components\",\"description\":\"Drawer blocks provide expandable panels for secondary actions and contextual content. They help keep dashboards clean while allowing users to access filters, settings, or details without leaving the current screen.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381474437-drawer.png\",\"alt\":\"Drawers\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:04:39.609Z\",\"updatedAt\":\"2026-01-14T09:04:39.609Z\"},{\"slug\":\"/blocks/horizontal-navbar\",\"_id\":\"69675c82fbcbd027dc9efeea\",\"name\":\"Horizontal Navbar\",\"sortOrder\":7,\"shortDescription\":\"5 Components\",\"description\":\"Horizontal navbar blocks support top-level navigation in dashboard layouts. They help organize pages, actions, and user controls in applications that require wide layouts or alternative navigation patterns.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381565419-horizontal-navbar.png\",\"alt\":\"Horizontal Navbar\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:06:10.640Z\",\"updatedAt\":\"2026-01-14T09:06:10.640Z\"},{\"slug\":\"/blocks/maps\",\"_id\":\"69675d3dfbcbd027dc9eff11\",\"name\":\"Maps\",\"sortOrder\":8,\"shortDe
3scription\":\"4 Components\",\"description\":\"Map blocks integrate location-based data into dashboards. They help visualize geographic information such as user distribution, assets, or activity, supporting analytics and operational use cases that rely on spatial context.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381752241-map.png\",\"alt\":\"Maps\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:09:17.118Z\",\"updatedAt\":\"2026-01-14T09:09:17.118Z\"},{\"slug\":\"/blocks/page-titles\",\"_id\":\"69675d6afbcbd027dc9eff2c\",\"name\":\"Page Titles\",\"sortOrder\":10,\"shortDescription\":\"4 Components\",\"description\":\"Page title blocks provide consistent headers for dashboard views. They help communicate page context, actions, and hierarchy clearly, improving navigation and usability across multi-page admin interfaces.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381800894-page-title.png\",\"alt\":\"Page Titles\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:10:02.789Z\",\"updatedAt\":\"2026-01-14T09:10:02.789Z\"},{\"slug\":\"/blocks/steps\",\"_id\":\"69675d90fbcbd027dc9eff41\",\"name\":\"Steps\",\"sortOrder\":9,\"shortDescription\":\"7 Components \",\"description\":\"Step blocks guide users through multi-step workflows and processes. They are useful for onboarding, setup flows, and complex actions where progress tracking and clarity are essential.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381833515-steps.png\",\"alt\":\"Steps\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:10:40.870Z\",\"updatedAt\":\"2026-01-14T09:10:40.870Z\"},{\"slug\":\"/blocks/widget\",\"_id\":\"69675deafbcbd027dc9eff68\",\"name\":\"Widget\",\"sortOrder\":11,\"shortDescription\":\"11 Components \",\"description\":\"Widget blocks are modular dashboard elements designed to display focused information or actions. They help build flexible layouts where components can be rearranged, reused, and scaled across different dashboard views.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381892825-widget.png\",\"alt\":\"Widget\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:12:10.097Z\",\"updatedAt\":\"2026-01-14T09:12:10.097Z\"},{\"slug\":\"/blocks/profiles\",\"_id\":\"69675e1efbcbd027dc9eff89\",\"name\":\"Profiles\",\"sortOrder\":12,\"shortDescription\":\"6 Components \",\"description\":\"Profile blocks present user or account information in a structured layout. They are suitable for dashboards that require account management, role visibility, and personal or organizational context.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768381959537-profile.png\",\"alt\":\"Profiles\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:13:02.895Z\",\"updatedAt\":\"2026-01-14T09:13:02.895Z\"},{\"slug\":\"/blocks/select-box\",\"_id\":\"69675e52fbcbd027dc9eff9e\",\"name\":\"Select Box\",\"sortOrder\":13,\"shortDescription\":\"5 Components\",\"description\":\"Select box blocks provide consistent dropdown and selection patterns for forms and filters. They help standardize user input across dashboards while maintaining accessibility and predictable behavior.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768382030098-selectbox.png\",\"alt\":\"Select Box\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:13:54.362Z\",\"updatedAt\":\"2026-01-14T09:13:54.362Z\"},{\"slug\":\"/blocks/setting-pages\",\"_id\":\"69675e85fbcbd027dc9effbf\",\"name\":\"Setting Pages\",\"sortOrder\":13,\"shortDe
3scription\":\"1 Components \",\"description\":\"Setting page blocks organize configuration options and preferences in a clear structure. They help users manage account, system, or application settings without overwhelming the interface.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768382082122-settings.png\",\"alt\":\"Setting Pages\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:14:45.654Z\",\"updatedAt\":\"2026-01-14T09:14:45.654Z\"},{\"slug\":\"/blocks/sidebar\",\"_id\":\"69675eb7fbcbd027dc9effda\",\"name\":\"Sidebar\",\"sortOrder\":14,\"shortDescription\":\"5 Components\",\"description\":\"Sidebar blocks define primary navigation for dashboard layouts. They help organize pages, tools, and actions into a persistent structure that supports scalability and efficient navigation across admin applications.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660d0e98242a70ab203832\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768382129483-sidebar.png\",\"alt\":\"Sidebar\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T09:15:35.514Z\",\"updatedAt\":\"2026-01-14T09:15:35.514Z\"}]},{\"_id\":\"69660e8598242a70ab203842\",\"name\":\"AI UI Blocks \",\"description\":\"React UI components designed for AI products and workflows. Includes chat interfaces, prompt inputs, message threads, sidebars, settings panels, and app layouts. Built to kickstart AI apps, assistants, and productivity tools with clean, scalable UI.\",\"slug\":\"ai-components\",\"sortingOrder\":0,\"label\":\"\",\"iconUrl\":\"https://assets.tailgrids.com/1768296066828-ai-component.svg\",\"createdAt\":\"2026-01-13T09:21:09.999Z\",\"updatedAt\":\"2026-01-20T08:30:48.706Z\",\"tags\":[{\"slug\":\"/blocks/ai-sidebar\",\"_id\":\"696723c2e6abfd4e72ebaa4a\",\"name\":\"AI Sidebar\",\"sortOrder\":1,\"shortDescription\":\"3 Components\",\"description\":\"AI sidebar blocks provide structured navigation for AI-powered tools and workflows. They help organize prompts, history, settings, and feature access in a persistent layout, making complex AI applications easier to navigate and scale as functionality grows.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660e8598242a70ab203842\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768367021682-sidebar.png\",\"alt\":\"Sidebar\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T05:04:02.634Z\",\"updatedAt\":\"2026-01-14T05:06:35.698Z\"},{\"slug\":\"/blocks/ai-hero\",\"_id\":\"6967297be6abfd4e72ebab9a\",\"name\":\"AI Hero\",\"sortOrder\":2,\"shortDe
3scription\":\"5 Components\",\"description\":\"AI hero blocks define the first impression of AI-driven products. They clearly communicate the core capability, use case, and value of the AI system, helping users understand what the product does and how it can help from the first screen.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660e8598242a70ab203842\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768368469876-ai-hero.png\",\"alt\":\"AI Hero\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T05:28:27.288Z\",\"updatedAt\":\"2026-01-14T06:21:35.459Z\"},{\"slug\":\"/blocks/text-generators\",\"_id\":\"69672fd9e6abfd4e72ebad3a\",\"name\":\"Text Generator\",\"sortOrder\":3,\"shortDescription\":\"6 Components \",\"description\":\"Text generator blocks provide structured interfaces for creating AI-generated content. They support prompt input, output display, and action controls, making them suitable for writing tools, content assistants, and AI-powered documentation or marketing workflows.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660e8598242a70ab203842\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768370106081-text-generator.png\",\"alt\":\"Text Generator\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T05:55:37.363Z\",\"updatedAt\":\"2026-01-22T06:19:59.870Z\"},{\"slug\":\"/blocks/image-generators\",\"_id\":\"696735c9e6abfd4e72ebb039\",\"name\":\"Image Generator\",\"sortOrder\":5,\"shortDescription\":\"4 Components \",\"description\":\"Image generator blocks provide clear layouts for generating and previewing AI-created visuals. They support prompt input, image output, and basic controls, making them suitable for design tools, creative platforms, and AI-powered visual workflows.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660e8598242a70ab203842\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768371631511-image-generator.png\",\"alt\":\"Image Generator\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T06:20:57.878Z\",\"updatedAt\":\"2026-01-22T04:54:00.784Z\"},{\"slug\":\"/blocks/video-generators\",\"_id\":\"69673644e6abfd4e72ebb08c\",\"name\":\"Video Generator\",\"sortOrder\":6,\"shortDescription\":\"4 Components\",\"description\":\"Video generator blocks help structure AI-driven video creation interfaces. They organize prompts, previews, and generation states clearly, supporting tools that transform ideas into short videos or visual content using AI models.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660e8598242a70ab203842\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768371774833-video-generator.png\",\"alt\":\"Video Generator\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T06:23:00.347Z\",\"updatedAt\":\"2026-01-22T06:25:56.245Z\"},{\"slug\":\"/blocks/code-generators\",\"_id\":\"69673683e6abfd4e72ebb0ad\",\"name\":\"Code Generator\",\"sortOrder\":4,\"shortDescription\":\"4 Components\",\"description\":\"Code generator blocks are designed for AI tools that produce or modify code. They help structure prompts, generated output, and actions like copy or refine, making them suitable for developer-focused products and AI-assisted programming interfaces.\",\"label\":\"\",\"isFeatured\":false,\"isHomeScreenTag\":false,\"categoryId\":\"69660e8598242a70ab203842\",\"thumbnails\":[{\"type\":\"png\",\"url\":\"https://assets.tailgrids.com/1768371825763-code-generator.png\",\"alt\":\"Code Generator\"}],\"availableOnGrayGrids\":true,\"createdAt\":\"2026-01-14T06:24:03.523Z\",\"updatedAt\":\"2026-01-22T04:32:54.120Z\"}]}],\"useFigmaLink\":false}]]}]\n"])</script>
3<script>self.__next_f.push([1,"49:[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}]\n4a:[\"$\",\"div\",null,{\"className\":\"relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n4b:[\"$\",\"div\",null,{\"className\":\"relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n4d:[\"$\",\"p\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"\\nTrusted by creators, product teams, startups, and companies building production-grade applications.\\n\"}}]\n"])</script>
3<script>self.__next_f.push([1,"4e:[\"$\",\"div\",null,{\"className\":\"relative bg-gray-100 p-5 sm:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"columns-1 gap-2 md:columns-2 lg:columns-3\",\"children\":[[\"$\",\"div\",\"0\",{\"className\":\"group @container/card relative mb-2 break-inside-avoid\",\"children\":[[\"$\",\"div\",null,{\"className\":\"gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex gap-3.5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"size-10 min-w-10 overflow-hidden rounded-full\",\"children\":[\"$\",\"$La\",null,{\"src\":\"/images/testimonials/fajar.png\",\"alt\":\"Fajar Siddiq\",\"width\":40,\"height\":40,\"className\":\"object-cover object-center\"}]}],[\"$\",\"div\",null,{\"className\":\"w-full\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-2.5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-medium -tracking-[.2px] text-tg-title-color\",\"children\":\"Fajar Siddiq\"}],[\"$\",\"div\",null,{\"className\":\"flex gap-0.5\",\"children\":[[\"$\",\"svg\",\"0\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"1\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"2\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"3\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":\"$L5f\"}],\"$L60\"]}]]}],\"$L61\"]}]]}],\"$L62\"]}],\"$L63\"]}],\"$L64\",\"$L65\",\"$L66\",\"$L67\",\"$L68\"]}]]}]\n"])</script>
3<script>self.__next_f.push([1,"4f:[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}]\n50:[\"$\",\"div\",null,{\"className\":\"relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n51:[\"$\",\"div\",null,{\"className\":\"relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n53:[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-2)]\"}]\n54:[\"$\",\"div\",null,{\"className\":\"relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n55:[\"$\",\"div\",null,{\"className\":\"relative -left-px col
3-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n"])</script>
3<script>self.__next_f.push([1,"57:[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/core-feature-4.14lenet45-.6u.png\",\"width\":854,\"height\":520,\"blurWidth\":8,\"blurHeight\":5,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAZUlEQVR42k2OywqAIBRE/YQeVvQyLXpQ66BF1Kr//yMnr6i4ONwLcxiG5aUCkRUSKR+Q5MJCv0GzVmwg6m5FL3dzl1jUTKgDnvv5cF6vbQyCb6iaGWU9gVejC3tCM7K52xAFQfgB2s80reJAW44AAAAASUVORK5CYII=\"},\"alt\":\"Developer Friendly\",\"className\":\"rounded-lg object-cover\"}]\n58:[\"$\",\"div\",null,{\"className\":\"p-5 xs:p-8\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg\",\"children\":\"Developer Friendly\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-gray-400 xs:text-base\",\"children\":\"Built for DX with CLI tooling, consistent component structures, and predictable patterns that scale from development to production.\"}]]}]\n59:[\"$\",\"$1\",\"4\",{\"children\":[\"$\",\"$L56\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/core-feature-5.0c.2t.ly0bxrg.png\",\"width\":854,\"height\":480,\"blurWidth\":8,\"blurHeight\":4,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAECAYAAACzzX7wAAAAWElEQVR42l3MSxJAMBAEUEdA/oR8JBQL7n85bZKFKha9mOlX3bRsRscdpEmUBVxFSqg/6u6mACY9Yr4Q0gk9rhV/QC88Jn/Aup1Ahhp+oBwFCR3rkrHbCx6TJSnAiNg3jgAAAABJRU5ErkJggg==\"},\"alt\":\"Easy to Use\",\"className\":\"rounded-lg object-cover\"}]}],[\"$\",\"div\",null,{\"className\":\"p-5 xs:p-8\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg\",\"children\":\"Easy to Use\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-gray-400 xs:text-base\",\"children\":\"Integrate a production-ready UI component library with predictable structure and minimal configuration. Copy components directly into existing or new Tailwind projects with confidence.\"}]]}]]}]}]}]\n5a:[\"$\",\"$1\",\"5\",{\"children\":[\"$\",\"$L56\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/core-feature-6.10whx_mhluqc0.png\",\"width\":852,\"height\":428,\"blurWidth\":8,\"blurHeight\":4,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAECAYAAACzzX7wAAAAUElEQVR42mXNQQqAIBCFYY9Q2khGTVOCUdSm+9/tlQO6cfHDMHzwTOcYOUui9cOqlb8pR5gTJD7g7YIPsQXTciCd749u0Li3wHnRLOUJruADdmQpRV5N4tUAAAAASUVORK5CYII=\"},\"alt\":\"Figma Design System\",\"className\":\"rounded-lg object-cover\"}]}],[\"$\",\"div\",null,{\"className\":\"p-5 xs:p-8\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg\",\"children\":\"Figma Design System\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-gray-400 xs:text-base\",\"children\":\"Own the complete Figma design system with components, tokens, and seamless design-to-development workflows.\"}]]}]]}]}]}]\n5b:[\"$\",\"$1\",\"6\",{\"children\":[\"$\",\"$L56\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/core-feature-7.0zji8353d9y4g.png\",\"width\":854,\"height\":440,\"blurWidth\":8,\"blurHeight\":4,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAECAYAAACzzX7wAAAARUlEQVR42k1NSQrAIBDzCbWOreAuiP//oBHEZQ4hJGQRjwrgkBS57mKb9BcYW6G+jFen6UliAW0KXGiTd+AsXPjVPDd9AEW/KIc1dIBFAAAAAElFTkSuQmCC\"},\"alt\":\"CLI Tool Support\",\"className\":\"rounded-lg object-cover\"}]}],[\"$\",\"div\",null,{\"className\":\"p-5 xs:p-8\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg\",\"children\":\"CLI Tool Support\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-gray-400 xs:text-base\",\"children\":\"Use the Tailgrids C"])</script>
3<script>self.__next_f.push([1,"LI to scaffold projects, add components, and standardize workflows across teams and codebases.\"}]]}]]}]}]}]\n5c:[\"$\",\"$1\",\"7\",{\"children\":[\"$\",\"$L56\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/core-feature-8.06ofd-g7bfhtx.png\",\"width\":854,\"height\":522,\"blurWidth\":8,\"blurHeight\":5,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAVklEQVR42lWOWw6AIAwEOYLIQ1CQWBOM97+fqymi8DFJ2500Kwa1oiL1P79cogQJeiK4JcO4nfdOUHbDHA+EdDI+ZL59Qn1vHXFoPWE0qRcKEfKh7XADOh0zBb3OFY4AAAAASUVORK5CYII=\"},\"alt\":\"Refreshing Design\",\"className\":\"rounded-lg object-cover\"}]}],[\"$\",\"div\",null,{\"className\":\"p-5 xs:p-8\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg\",\"children\":\"Refreshing Design\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-gray-400 xs:text-base\",\"children\":\"Clean, high-quality UI aligned with modern design standards, delivering visual clarity, strong hierarchy, and polished experiences across products.\"}]]}]]}]}]}]\n5d:[\"$\",\"$1\",\"8\",{\"children\":[\"$\",\"$L56\",null,{\"children\":[\"$\",\"div\",null,{\"className\":\"box-hover flex flex-col rounded-2xl bg-[#10131E] group mb-2 break-inside-avoid nth-[4]:flex-col-reverse\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-center\",\"children\":[\"$\",\"$La\",null,{\"src\":{\"src\":\"/_next/static/media/core-feature-9.0g8mvinv7oozs.png\",\"width\":852,\"height\":422,\"blurWidth\":8,\"blurHeight\":4,\"blurDataURL\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAECAYAAACzzX7wAAAAUUlEQVR42k2MSw6AIBBDOYIK+AufURcYvP/5ajqwYNF0kvemZrIJs8tYvGiPITM8jlAQcsUZX/j9gdtu2PVSSQWCJJ9KUWqXSxM4w3l+sMeQ/YcfKZv9dOqMAAAAAElFTkSuQmCC\"},\"alt\":\"Fully Responsive\",\"className\":\"rounded-lg object-cover\"}]}],[\"$\",\"div\",null,{\"className\":\"p-5 xs:p-8\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"mb-2 text-base font-medium -tracking-[.2px] text-white xs:text-lg\",\"children\":\"Fully Responsive\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-gray-400 xs:text-base\",\"children\":\"Designed to adapt across screen sizes and modern browsers, with components tested to ensure consistent layout and behavior on all devices.\"}]]}]]}]}]}]\n5f:[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]\n60:[\"$\",\"svg\",\"4\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}]\n61:[\"$\",\"p\",null,{\"className\":\"mt-1 text-sm -tracking-[.2px] text-gray-400\",\"children\":\"Serial Entrepreneur, Singapore\"}]\n62:[\"$\",\"div\",null,{\"className\":\"mt-7.5 text-sm -tracking-"])</script>
3<script>self.__next_f.push([1,"[.2px] text-tg-text-color-secondary xs:text-base\",\"children\":\"Tailgrids is such a great help when comes to building landing page and web app UI for Tailwind CSS web projects with just copy-paste method! is really liked the design and it is easy to get started which saves tons of time \u0026 money for developers and designers with Figma files \u0026 source code!\"}]\n63:[\"$\",\"div\",null,{\"className\":\"pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100\",\"children\":[[\"$\",\"span\",null,{\"className\":\"top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5\"}],[\"$\",\"span\",null,{\"className\":\"bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5\"}]]}]\n"])</script>
3<script>self.__next_f.push([1,"64:[\"$\",\"div\",\"1\",{\"className\":\"group @container/card relative mb-2 break-inside-avoid\",\"children\":[[\"$\",\"div\",null,{\"className\":\"gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex gap-3.5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"size-10 min-w-10 overflow-hidden rounded-full\",\"children\":[\"$\",\"$La\",null,{\"src\":\"/images/testimonials/marko.png\",\"alt\":\"Marko Denic\",\"width\":40,\"height\":40,\"className\":\"object-cover object-center\"}]}],[\"$\",\"div\",null,{\"className\":\"w-full\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-2.5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-medium -tracking-[.2px] text-tg-title-color\",\"children\":\"Marko Denic\"}],[\"$\",\"div\",null,{\"className\":\"flex gap-0.5\",\"children\":[[\"$\",\"svg\",\"0\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"1\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"2\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"3\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],\"$L69\"]}]]}],\"$L6a\"]}]]}],\"$L6b\"]}],\"$L6c\"]}]\n"])</script>
3<script>self.__next_f.push([1,"65:[\"$\",\"div\",\"2\",{\"className\":\"group @container/card relative mb-2 break-inside-avoid\",\"children\":[[\"$\",\"div\",null,{\"className\":\"gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex gap-3.5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"size-10 min-w-10 overflow-hidden rounded-full\",\"children\":[\"$\",\"$La\",null,{\"src\":\"/images/testimonials/athar.png\",\"alt\":\"Athar Ahmed\",\"width\":40,\"height\":40,\"className\":\"object-cover object-center\"}]}],[\"$\",\"div\",null,{\"className\":\"w-full\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-2.5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-medium -tracking-[.2px] text-tg-title-color\",\"children\":\"Athar Ahmed\"}],[\"$\",\"div\",null,{\"className\":\"flex gap-0.5\",\"children\":[[\"$\",\"svg\",\"0\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"1\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"2\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"3\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],\"$L6d\"]}]]}],\"$L6e\"]}]]}],\"$L6f\"]}],\"$L70\"]}]\n"])</script>
3<script>self.__next_f.push([1,"66:[\"$\",\"div\",\"3\",{\"className\":\"group @container/card relative mb-2 break-inside-avoid\",\"children\":[[\"$\",\"div\",null,{\"className\":\"gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex gap-3.5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"size-10 min-w-10 overflow-hidden rounded-full\",\"children\":[\"$\",\"$La\",null,{\"src\":\"/images/testimonials/ostap.png\",\"alt\":\"Ostap Brehin\",\"width\":40,\"height\":40,\"className\":\"object-cover object-center\"}]}],[\"$\",\"div\",null,{\"className\":\"w-full\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-2.5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-medium -tracking-[.2px] text-tg-title-color\",\"children\":\"Ostap Brehin\"}],[\"$\",\"div\",null,{\"className\":\"flex gap-0.5\",\"children\":[[\"$\",\"svg\",\"0\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"1\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"2\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"3\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],\"$L71\"]}]]}],\"$L72\"]}]]}],\"$L73\"]}],\"$L74\"]}]\n"])</script>
3<script>self.__next_f.push([1,"67:[\"$\",\"div\",\"4\",{\"className\":\"group @container/card relative mb-2 break-inside-avoid\",\"children\":[[\"$\",\"div\",null,{\"className\":\"gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex gap-3.5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"size-10 min-w-10 overflow-hidden rounded-full\",\"children\":[\"$\",\"$La\",null,{\"src\":\"/images/testimonials/arnob.png\",\"alt\":\"Arnob Mukherjee\",\"width\":40,\"height\":40,\"className\":\"object-cover object-center\"}]}],[\"$\",\"div\",null,{\"className\":\"w-full\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-2.5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-medium -tracking-[.2px] text-tg-title-color\",\"children\":\"Arnob Mukherjee\"}],[\"$\",\"div\",null,{\"className\":\"flex gap-0.5\",\"children\":[[\"$\",\"svg\",\"0\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"1\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"2\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"3\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],\"$L75\"]}]]}],\"$L76\"]}]]}],\"$L77\"]}],\"$L78\"]}]\n"])</script>
3<script>self.__next_f.push([1,"68:[\"$\",\"div\",\"5\",{\"className\":\"group @container/card relative mb-2 break-inside-avoid\",\"children\":[[\"$\",\"div\",null,{\"className\":\"gap-7.5 overflow-hidden rounded-xl bg-white p-5 @xs/card:p-7.5 @sm/card:p-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex gap-3.5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"size-10 min-w-10 overflow-hidden rounded-full\",\"children\":[\"$\",\"$La\",null,{\"src\":\"/images/testimonials/kamal.png\",\"alt\":\"Kamal Hosen\",\"width\":40,\"height\":40,\"className\":\"object-cover object-center\"}]}],[\"$\",\"div\",null,{\"className\":\"w-full\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-2.5\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"text-base font-medium -tracking-[.2px] text-tg-title-color\",\"children\":\"Kamal Hosen\"}],[\"$\",\"div\",null,{\"className\":\"flex gap-0.5\",\"children\":[[\"$\",\"svg\",\"0\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"1\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"2\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],[\"$\",\"svg\",\"3\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}],\"$L79\"]}]]}],\"$L7a\"]}]]}],\"$L7b\"]}],\"$L7c\"]}]\n"])</script>
3<script>self.__next_f.push([1,"69:[\"$\",\"svg\",\"4\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}]\n6a:[\"$\",\"p\",null,{\"className\":\"mt-1 text-sm -tracking-[.2px] text-gray-400\",\"children\":\"Developer Advocate and Software Engineer\"}]\n6b:[\"$\",\"div\",null,{\"className\":\"mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base\",\"children\":\"Tailgrids comes with all the essential UI components you need to create beautiful websites based on Tailwind CSS. The design consistency \u0026 variations of UI components, clean codebase, copy-paste interface, and detailed documentation made this UI library very organized \u0026 super easy to use.\"}]\n6c:[\"$\",\"div\",null,{\"className\":\"pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100\",\"children\":[[\"$\",\"span\",null,{\"className\":\"top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5\"}],[\"$\",\"span\",null,{\"className\":\"bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5\"}]]}]\n6d:[\"$\",\"svg\",\"4\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}]\n6e:[\"$\",\"p\",null,{\"className\":\"mt-1 text-sm -tracking-[.2px] text-gray-400\",\"children\":\"Founder, ScrapeOwl and Senior Software Engineer @Aide\"}]\n6f:[\"$\",\"div\",null,{\"className\":\"mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base\",\"children\":\"Since I like doing engineering parts only, designing and coding landing pages is great blocker for me while I develop MVPs or try to validate a new product idea. Tailgrids seems have great collection of UI components that also comes relevant contents and Figma file that I can use to play or create prototype before diving into code.\"}]\n70:[\"$\",\"div\",null,{\"className\":\"pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100\",\"children\":[[\"$\",\"span\",null,{\"className\":\"top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5\"}],[\"$\",\"span\",null,{\"className\":\"bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"righ"])</script>
3<script>self.__next_f.push([1,"t-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5\"}]]}]\n71:[\"$\",\"svg\",\"4\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}]\n72:[\"$\",\"p\",null,{\"className\":\"mt-1 text-sm -tracking-[.2px] text-gray-400\",\"children\":\"Fullstack Developer and Building NotionMailer\"}]\n73:[\"$\",\"div\",null,{\"className\":\"mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base\",\"children\":\"A landing page is the first thing your customers will see before even trying the project. You want to make sure it looks great, and this is where Tailgrids comes to help! It provides a collection of beautiful hand-crafted uniquely-looking components that you can use to build your startup website, web application, or dashboard.\"}]\n74:[\"$\",\"div\",null,{\"className\":\"pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100\",\"children\":[[\"$\",\"span\",null,{\"className\":\"top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5\"}],[\"$\",\"span\",null,{\"className\":\"bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5\"}]]}]\n75:[\"$\",\"svg\",\"4\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}]\n76:[\"$\",\"p\",null,{\"className\":\"mt-1 text-sm -tracking-[.2px] text-gray-400\",\"children\":\"Founder @Olvy\"}]\n77:[\"$\",\"div\",null,{\"className\":\"mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base\",\"children\":\"Seems like an amazing alternative to tailwindui, also the design looks amazing man ð\"}]\n78:[\"$\",\"div\",null,{\"className\":\"pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100\",\"children\":[[\"$\",\"span\",null,{\"className\":\"top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5\"}],[\"$\",\"span\",null,{\"className\":\"bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5\"}]]}
3]\n79:[\"$\",\"svg\",\"4\",{\"width\":\"10\",\"height\":\"10\",\"viewBox\":\"0 0 10 10\",\"fill\":\"none\",\"xmlns"])</script>
3<script>self.__next_f.push([1,"\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M4.21372 0.531161C4.51768 -0.177053 5.48233 -0.177053 5.78627 0.53116L6.58621 2.39504C6.71142 2.68681 6.97604 2.88718 7.28097 2.92113L9.22906 3.13803C9.96926 3.22046 10.2674 4.17661 9.71501 4.69672L8.26131 6.06558C8.03375 6.27984 7.93267 6.60406 7.99593 6.9168L8.39997 8.91473C8.55351 9.67389 7.77309 10.2648 7.12776 9.87806L5.4294 8.86017C5.16354 8.70084 4.83645 8.70084 4.57061 8.86017L2.87224 9.87806C2.22692 10.2648 1.4465 9.67389 1.60002 8.91473L2.00408 6.9168C2.06732 6.60406 1.96624 6.27984 1.7387 6.06558L0.284994 4.69672C-0.267362 4.17661 0.0307316 3.22046 0.770938 3.13803L2.71902 2.92113C3.02396 2.88718 3.28858 2.68681 3.4138 2.39504L4.21372 0.531161Z\",\"fill\":\"#FACC15\"}]}]\n7a:[\"$\",\"p\",null,{\"className\":\"mt-1 text-sm -tracking-[.2px] text-gray-400\",\"children\":\"Software Developer @HappyAddons\"}]\n7b:[\"$\",\"div\",null,{\"className\":\"mt-7.5 text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base\",\"children\":\"Having used almost all the Tailwind CSS UI toolkits and resources, I can confidently say that Tailgrids is the easiest and most comprehensive Tailwind UI Library with almost all essential Tailwind CSS components you may need to build web UI faster. Specially, code explorer and copy-paste inteface is time-saver. Highly recommended!\"}]\n7c:[\"$\",\"div\",null,{\"className\":\"pointer-events-none absolute inset-0 h-full w-full *:absolute *:size-2 *:rounded-full *:bg-gray-300 *:opacity-0 *:shadow-[0_0.75px_0.75px_0_rgba(0,0,0,0.05)_inset] *:duration-200 group-hover:*:opacity-100\",\"children\":[[\"$\",\"span\",null,{\"className\":\"top-0 left-0 duration-200 group-hover:top-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"top-0 right-0 duration-200 group-hover:top-2.5 group-hover:right-2.5\"}],[\"$\",\"span\",null,{\"className\":\"bottom-0 left-0 duration-200 group-hover:bottom-2.5 group-hover:left-2.5\"}],[\"$\",\"span\",null,{\"className\":\"right-0 bottom-0 duration-200 group-hover:right-2.5 group-hover:bottom-2.5\"}]]}]\n"])</script>
3<script>self.__next_f.push([1,"7d:I[905936,[\"/_next/static/chunks/0vzb-tgl663zb.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0i.l9589uvx0j.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0lcgsvap58u_i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0pc2j_c747ylw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0weoxb4xt5z-c.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/05ovwf9e~glmu.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0fuw36qwmym1i.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0bz15w7h_ee0q.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/0aq6zks81mppi.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/07k9l5xu.k4h2.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/02r5hpe~xc5iw.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/13eso9agw9kyk.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\",\"/_next/static/chunks/06il9i8ivt8h0.js?dpl=dpl_D91iCQX8U6vbmHbTVzpi9im5RVPJ\"],\"default\"]\n7e:T23c9,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNexStudio\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact agency website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e built for digital agencies, product studios, and development teams. It provides a complete website structure to present services, showcase projects, and attract new clients. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template supports agencies working with startups, growing businesses, and enterprise clients. It helps teams explain what they do and show their work clearly.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNexStudio is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React manages page structure and UI logic, while Tailwind CSS controls layout and styling through utility classes. TailGrids provides reusable UI blocks such as headers, service sections, project cards, and footers. This setup keeps the codebase clean and easy to extend.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDigital Agencies:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Present services, case studies, and client outcomes.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProduct Studios:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Showcase product design and development work.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eConsulting Teams:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain offerings, process, and expertise.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eStartup Service Providers:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Promote development, design, and strategy services.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI and SaaS Teams:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Describe technical solutions and delivery capabilities.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eService Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain web, mobile, backend, and design services clearly.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProject Showcase:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Display completed projects with category and date.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eClient Testimonials:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Share real client feedback to support trust.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAbout and Team Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Present company background and values.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Publish insights, updates, and articles.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCall-to-Action Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Guide visitors to contact or project inquiries.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Works across desktop, tablet, and mobile screens.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Keeps layouts consistent across pages.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eScalable Structure:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Supports adding new services and projects over time.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProjects\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eServices\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAbout\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFooter\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNexStudio\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a production-ready \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact agency website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e built for real client-facing teams. It offers clear structure, reusable components, and flexible styling with Tailwind CSS. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template supports everyday agency needs such as presenting services, showcasing work, and capturing leads. It provides a stable foundation for agencies and studios building a professional web presence.\u003c/span\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"7f:T2492,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFincash\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact fintech website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e built for digital wallets, payment apps, and personal finance platforms. It provides a complete website structure to present features, pricing, user flows, and trust signals. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template is designed for teams building finance products that require clarity, security-focused layout, and simple navigation. It supports both early-stage fintech apps and growing consumer finance platforms.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFincash is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React manages interface logic and page structure, while Tailwind CSS controls layout and styling through utility classes. TailGrids provides reusable UI blocks, including dashboards, feature sections, pricing tables, and footers. This setup keeps the codebase clean and easy to maintain as features expand.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDigital Wallet Apps:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Balances, payments, and transaction flows.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePersonal Finance Tools:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Track spending, income, and financial activity.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePayment Platforms:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain transfers, cards, and payment features clearly.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFintech Startups:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Launch consumer finance products with a complete website.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003eMoney Management Apps:\u003c/strong\u003e\u003cspan style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003e Showcase dashboards, insights, and pricing plans.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFinance Dashboard Layout:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Displays balances, activity, and quick actions clearly.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePayment Feature Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explains transfers, cards, and wallet actions.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eInsights Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Shows income and expense tracking visuals.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eOnboarding Flow Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Describes account setup and first-use steps.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Free, starter, and premium plans clearly.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUser Testimonials:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Shares real user feedback to build trust.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQ Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Answers common questions about security and usage.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMobile-First Design:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Optimized for app-focused and mobile users.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Adapts across desktop, tablet, and mobile screens.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Maintains consistent structure across pages.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeatures\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eApp Workflow\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQs\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFooter\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFincash\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a production-ready \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact fintech website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e built for real financial products. It combines clear page structure, reusable components, and flexible styling with Tailwind CSS. The template supports common fintech needs such as feature explanation, pricing clarity, and trust building. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIt provides a stable foundation for teams building payment and money management apps.\u003c/span\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"80:T24a6,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWriteMate AI\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact AI website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e built for AI-powered content platforms that use one or more language models. It provides a comprehensive website structure to explain AI features, support user onboarding, and offer pricing plans and documentation. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template is designed for teams building AI writing tools, AI chat products, and content-focused SaaS platforms. It helps users understand the product quickly and start using it with minimal friction.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe layout supports clear explanations of features and guided user flows. Sections are arranged to show how AI tools work, what users can create, and how plans differ.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWriteMate AI is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React manages the interface and page structure. Tailwind CSS controls layout and styling through utility classes. TailGrids provides reusable UI blocks, including feature cards, pricing tables, testimonials, and call-to-action sections.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Writing Tools:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Present blog writing, email drafting, and content generation features.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Chatbot Products:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain chatbot use cases and interaction flows.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAll-in-One AI Platforms:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Describe tools powered by multiple language models.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003eContent Automation Tools:\u003c/strong\u003e\u003cspan style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003e Showcase AI-driven writing and content processing.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeature Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Clearly describe AI capabilities and workflows.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Tool Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Present writing, chat, and content generation tools.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Show free, paid, and enterprise plans.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTrust and Client Logos:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Display adoption and credibility signals.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUser Testimonials:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Share feedback from real users and teams.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQ Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Answer common questions about usage and data handling.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCall-to-Action Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Encourage users to start or explore features.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Works across desktop and mobile devices.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Keeps structure consistent across pages.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeatures\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDocs\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSupport\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQs\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCTA\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFooter\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWriteMate AI\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a production-ready \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact AI website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e built for real AI SaaS products. It supports AI writing tools and content platforms within a single website structure. \u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWith reusable components and flexible styling using Tailwind CSS, the template provides a foun
3dation for building\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e all-in-one AI platforms\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e.\u003c/span\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"81:T25b5,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaSly\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact SaaS website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e designed to showcase SaaS products that help teams manage data, users, and business operations. It provides a complete public-facing website structure to explain product capabilities, show real use cases, and convert visitors into users. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template is designed for SaaS teams that require a clear and credible product website. The layout focuses on explaining how the product works. Sections are arranged to highlight value, build trust, and guide users toward starting a trial or viewing a demo.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaSly is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React manages page structure and interactions. Tailwind CSS controls layout, spacing, and styling through utility classes. TailGrids provides reusable UI sections, including feature blocks\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS Marketing Websites:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Clearly showcase software products, features, and pricing.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAnalytics SaaS Products:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain performance tracking, KPIs, and reporting features.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCRM and User Platforms:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Showcase user management and activity tracking tools.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003eStartup SaaS Products:\u003c/strong\u003e\u003cspan style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003e Launch product websites with a ready conversion-focused structure.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProduct-Focused Hero Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Communicate value and guide users to demos or trials.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeature Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain analytics, user management, and transaction insights.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Case Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain how different teams apply the product.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIntegration Highlights:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Show supported tools and platform connections.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Display feedback from product teams and users.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Free, starter, pro, and enterprise plans.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eLogin and Trial CTAs:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Support user access and trial onboarding.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQ Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Answer common product and setup questions.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Works across desktop, tablet, and mobile screens.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003eReusable React Components:\u003c/strong\u003e\u003cspan style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003e Maintain consistent layout and structure.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2\u003e\u003cspan style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeatures\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAbout\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eStart Free Trial\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIntegrations\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQs\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFooter\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaSly\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003e is an easy-to-customise \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e for \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS \u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003emarketing websites designed for modern SaaS solutions. It combines clear product messaging, reusable components, and flexible styling with Tailwind CSS. \u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template includes common SaaS requirements, such as feature explanations, testimonials, integrations, strong CTA, and pricing details.\u003c/span\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"82:T2795,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNeoxa is a React \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS dashboard template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e built for modern web apps and SaaS products. It offers a complete admin dashboard with pre-built pages for managing users, orders, invoices, subscriptions, and operations.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThis template is designed for teams building SaaS platforms that need structured dashboard layouts and consistent UI patterns. Each page is designed to focus on clarity, data visibility, and ease of navigation. It helps teams manage workflows and products efficiently.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNeoxa is built using Tailwind CSS and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact Dashboard UI Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React handles routing, state, and interactive views across the dashboard. Tailwind CSS manages layout, spacing, and styling. TailGrids provides reusable UI elements to maintain consistency across all sections.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS Dashboard Template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: For subscription-based products.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS Products\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Manage users, plans, orders, and invoices.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWeb Apps\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Create internal tools with structured data views.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAdmin Interfaces\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Control system activity, users, and operations.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003eSupport Systems\u003c/strong\u003e\u003cspan style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003e: Track and manage customer support tickets.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashboard Overview\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: KPI cards for signups, churn, tickets, and subscriptions.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUser Management\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: User lists with roles, status, and actions.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eOrder Management\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Orders table with search, filters, and status labels.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eInvoice Pages\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Invoice lists with payment states and actions.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eAnalytics Views\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Revenue charts and performance summaries.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSupport Tickets\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Lists of tickets with progress and resolution states.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAuthentication Pages\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Sign In, Sign Up, Reset Password, and Two Step Verification.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSettings Panels\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Profile, Security, and Application Preferences.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePre-Built UI Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Cards, tables, charts, forms, and filters.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003eResponsive Design\u003c/strong\u003e\u003cspan style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003e: Optimized for modern SaaS web applications.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashboard\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUsers\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eOrders\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eInvoices\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAnalytics\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSupport Tickets\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSettings\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProfile\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSecurity\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eApp Preferences\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSign In\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSign Up\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReset Password\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTwo Step Verification\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNeoxa is an \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eeasy-to-customize\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e React SaaS dashboard template built for real-world use. It reduces setup work and maintains consistent screens across the app. The template supports core SaaS needs, including user management, tracking, and analytics.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIt provides a stable foundation for teams building scalable SaaS dashboards and web applications using React.\u003c/span\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"83:T2a0f,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTechSelf is a React e-commerce template created for building \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eelectronics and gadget \u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ewebsites. It provides a ready storefront layout that includes browsing, product display, sales, and checkout flows. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template is designed for teams that want a structured\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e e-commerce website\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e from day one. It focuses on how users explore and interact with products. Product cards, category sections, and promotions are placed to support quick scanning and straightforward navigation. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTechSelf is built using \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React handles page rendering and state logic, while Tailwind CSS controls layout and styling through utility classes. TailGrids provide reusable, fully customizable UI blocks, including headers, product cards, and footers. The template uses consistent spacing, typography, and grid systems across all pages. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eElectronics Stores:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Sell gadgets, devices, and tech accessories.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMulti-Category Stores:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Organize products across multiple categories.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eD2C Brands:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Operate a branded online store.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eStartup Ecommerce Projects:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Launch quickly with a pre-built store layout.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003eLarge Catalog Stores:\u003c/strong\u003e\u003cspan style=\"color: rgb(0, 0, 0); background-color: transparent;\"\u003e Manage and display a wide range of products clearly.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProduct Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Each product page features a clear layout that organizes images, pricing, and details.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCategory Organization:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Products are grouped into sections to reduce search effort.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePromotional Areas:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Sale banners and discount sections highlight time-based offers.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eShopping Cart Flow:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Cart pages allow users to review items before checkout.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCheckout Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Layout supports standard address, payment, and order review steps.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCustomer Review Blocks:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Feedback sections show real user input on products.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQ:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Common store questions are answered in one place.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Grid adapts smoothly across screen sizes.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUtility-Based Styling:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Tailwind CSS enables fast design adjustments.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable UI Components:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Shared components reduce layout inconsistency.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eShop\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProducts\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCategories\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSale\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProduct Page\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eShopping Cart\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCheckout\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQs\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNewsletter\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFooter\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTechSelf\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is an easy-to-customize, production-ready React e-commerce template built for online stores. It combines clear page structure,\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e flexible styling\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e, and reusable \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. The template supports everyday ecommerce tasks such as product display, promotions, and checkout.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIt is suitable for teams that need a stable foundation for building and running an \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eonline electronics store\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e using React and Tailwind CSS.\u003c/span\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"84:T2834,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eOriginix\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact startup website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e built for founders, early-stage teams, and growing businesses. It provides a complete \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ebusiness website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e to present ideas, explain services, and support product or company launches. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template is suited for teams building a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003estartup company website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e that prioritizes clarity and execution.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe layout helps startups explain what they are building and why it matters. Content sections guide visitors through the product vision, service approach, and growth mindset, making it suitable for a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003etech startup website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e or a modern business site.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eOriginix is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React manages page structure and interactions. Tailwind CSS handles layout, spacing, and styling using utility classes. TailGrids provides reusable UI sections for services, process steps, testimonials, blogs, and calls to action.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eStartup Websites:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Launch and Present Early-Stage Ideas Clearly.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBusiness Websites:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Communicate services, vision, and company values.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTech Startup Sites:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain digital products, platforms, or services.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFounder-Led Companies:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Share approach, process, and direction.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eService-Based Startups:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Showcase offerings and execution model.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eStartup-Focused Hero Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Clearly communicate purpose and direction.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eService Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain offerings and business capabilities.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProcess Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Show how ideas move from concept to launch.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWhy Choose Us Blocks:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Highlight speed, clarity, and growth principles.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonial Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Share feedback from early users and partners.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQ Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Answer common questions for early-stage companies.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Publish insights for founders and startup teams.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCall-to-Action Blocks:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Guide visitors to early access or contact.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNewsletter Signup:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Capture interest and updates.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eServices\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAbout\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProcess\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQs\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNewsletter\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFooter\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eOriginix\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a production-ready website template built for startups and modern companies. It combines clear structure, reusable components, and flexible styling. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template supports core startup and business needs, including service presentation, trust building, and lead capture. It provides a stable foundation for teams\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e building a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003estartup company website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e or a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003etech startup website template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e using React.\u003c/span\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"85:T2625,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFundex\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact finance dashboard template\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e built for personal finance apps and internal tools. It provides a comprehensive dashboard that helps users track their income and expenses, monitor cash flow, and manage budgets in a single, clear view.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThis template is designed for teams building personal finance products with structured workflows. The layout prioritizes real-time updates and clear data grouping to support faster decisions and daily financial tracking.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFundex is built using \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e React Dashboard UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React manages data views and user actions across the dashboard. Tailwind CSS controls layout, spacing, and visual consistency. TailGrids provides reusable UI components for cards, tables, charts, and settings pages.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe design uses consistent spacing and typography. This improves readability and makes financial data easier to scan and compare.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePersonal Finance Apps\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Track income and expenses, cash flow, and net worth.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFintech Dashboards\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Display real-time balances, transactions, and analytics.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eExpense Tracking Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Review spending by category, date, and payment type.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBudget Planning Systems\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Set limits, track usage, and avoid overspending.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBusiness Finance Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Monitor company finances and internal reports.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashboard Overview:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Shows income, expenses, cash flow, and balance cards.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTransaction Management:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Table layout with search and filter options.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAnalytics Charts:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Visual components for income vs. expense data.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBudget Tracking:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e View category spending with clear progress bars and charts.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBalance Cards:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Cards showing available funds with action buttons.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNotification Center:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Receive payment confirmations, budget alerts, and account activity warnings.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSettings Pages:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Control profile information, security options, user preferences, and legal.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eData Export: \u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDownload page with transactions and reports in CSV or PDF format.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSecurity Controls:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Support password updates, two-factor authentication, and sessions.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashboard\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTransactions\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAnalytics\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBudgets\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNotifications\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProfile\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCards \u0026amp; Accounts\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSettings\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSecurity\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eApp Preferences\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eData Management\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eLegal \u0026amp; Support\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFundex\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e is a ready-to-use React dashboard UI template for personal finance and fintech products. It supports common financial workflows, including transaction tracking, budget monitoring, and financial reporting, all within a single interface.\u003c/span\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"86:T24bc,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAISpace is a modern React landing page template designed for AI SaaS products, developer tools, and startup platforms. It helps quickly launch a conversion-focused website to showcase features and workflows.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template follows a simple and clear structure. It starts with an AI prompt-style hero section to introduce your product. Then it moves through key sections like features, pricing, testimonials, and blog content. Each section is designed to guide users toward taking action, such as signing up or exploring your product.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAISpace uses \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e to build the UI and handle interactions. It uses \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e for styling with simple utility classes. The UI is powered by Tailgrids, which provide ready-to-use components like feature grids, pricing tables, testimonials, and call-to-action sections. This keeps the design consistent and easy to extend.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI SaaS Products\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Show off features, prices, and workflows in a modern way.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDeveloper Tools:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Clearly showcase APIs, integrations, and technical capabilities.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eStartup Websites:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Create product websites with well-organized sections and clear messages.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Platforms:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain use cases, capabilities, and user benefits in a simple flow.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Prompt Hero\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Input-based hero section with prompt field and quick actions.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTrust Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Show company logos and trust signals to build credibility.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eStats Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Highlight usage metrics and product performance.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeature Sections:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Grid-based layout to explain core product capabilities.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Clearly compare free and paid plans.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Show user feedback in clean, easy-to-scan cards.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Share updates, guides, and product insights.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCTA Sections\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Encourage users to get started or explore features.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact Section:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Collect user inquiries with a simple form.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNewsletter Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: To capture emails for updates and announcements.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Optimized for all screen sizes, desktop, tablet, and mobile devices.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: To maintain a consistent and scalable UI.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeatures\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAbout\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Details\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSign In\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSign Up\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e404\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAISpace is a Tailwind + React template built for AI SaaS products and tools. The template helps to quickly explain features, build trust, and convert. It provides a strong foundation for launching an AI SaaS product website.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"87:T2cef,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBizSpace is a fully customizable business consulting website template built for firms, digital agencies, business professionals, entrepreneurs, and service companies. It helps to quickly customize and launch a website to showcase services, demonstrate work, and generate leads.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template is handcrafted for agencies that provide consulting, strategy, branding, or marketing services. It has a conversion-focused layout. The landing page starts with a hero for introduction, then covers services, company information, portfolio work, and client feedback. This flow makes it simple to see what you do.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBizSpace is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React handles layout and interactions, while Tailwind CSS manages styling using utility classes. Tailgrids provides ready-to-use UI components like service blocks, portfolio cards, testimonials, and contact forms.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBusiness Consulting Firms\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Present services, case studies, and client results.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDigital Agencies\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Showcase strategy, design, and marketing services.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCreative Studio\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003es: Display portfolio work and client projects.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMarketing Agencies\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Highlight campaigns, performance, and outcomes.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProfessional Service\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003es: Share team expertise and convert client inquiries.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHero Section:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Introduce the brand with a headline, description, and a call to action.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eClient Logos\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Display trusted companies and social proof.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAbout Section:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Explain the company background and process.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eServices Section:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Present consulting and service offerings clearly.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWhy Choose Us\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Highlight key strengths and capabilities.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePerformance Metrics\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Show business impact and key numbers.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePortfolio Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: This section highlights selected projects and case studies.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Share client feedback and reviews.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTeam Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Introduce team members and roles.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Publish insights and industry content.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCTA Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Encourage users to get started or contact the team.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact Section:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Collect inquiries with form and location details.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Design\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Works across desktop, tablet, and mobile devices.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Help to keep page structure uniform and easy to scale.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Pages and Sections\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAbout\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWhat we offer section\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeatues\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAchievement\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeatured Work\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonial\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTeam\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact Section\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eServices page\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePortfolio Page\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePortfolio Details\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Details\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact Page\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e404 Page\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBizSpace is a Tailwind React template for websites that offer consulting or other services. The template meets basic needs, such as showcasing services, building trust, and generating leads. It provides a strong starting point for building an online presence.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"88:T1eff,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAppSpace is a React landing page template built for mobile apps, productivity tools, and SaaS products. It helps you quickly launch a website to showcase your app, build trust, and increase downloads or sign-ups.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template uses a clean layout with proper spacing, so everything feels easy to scan. It starts with a hero section that highlights your app, including rating badges and a clear download button. After that, you get sections for features, simple step-by-step usage, and social proof.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIt is suitable for both new apps and growing products that need a clear and visually updated landing page.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAppSpace is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React manages layout and interactions, while Tailwind CSS controls styling through utility classes. Tailgrids provides reusable UI components, including feature blocks, pricing tables, testimonials, and call-to-action sections. This keeps the page consistent and easy to update.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMobile App Launches\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Present features, benefits, and download options.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProductivity Apps\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Highlight workflows and task management\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTask Management Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Explain collaboration and tracking features.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHero Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Clean layout with app preview, ratings, and download CTAs.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeature Sections\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Grid-based layouts with icons and balanced spacing.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHow It Works\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Step-by-step flow with simple and structured visuals.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Clean card layouts for user feedback and building trust.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003e: Pricing tables with clear plan comparison.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQ Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Accordion layout for quick access to common queries.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNewsletter Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Minimal design for email capture.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Simple inquiry form for quick contact.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout: \u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWorks well on all screen sizes.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Maintain the UI structure and make it easy to scale.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeatures\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Details\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSign In\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSign Up\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAppSpace is a React app landing page template styled using Tailwind CSS. The template includes all the key elements for showcasing benefits, building trust, and encouraging more people to download the app. It gives you a solid base to start an informational website for a mobile app.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"89:T2205,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaasSpace is a React SaaS landing page template for SaaS platforms, dashboards, and digital products. It helps you launch a website to showcase features, product previews, and pricing.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template has a modern design system with a clear hierarchy, balanced spacing, and a mobile-first layout. It starts with a hero section, then moves through trust signals, features, and product previews. Pricing, testimonials, and blog sections help build trust, while call-to-action sections encourage users to join or explore.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaasSpace is built with Tailwind CSS and React UI components. React manages layout and interactions, while Tailwind CSS controls styling through utility classes. Tailgrids provides reusable UI components, including feature blocks, integration sections, testimonials, and call-to-action. This keeps the code easy to manage and extend.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS Platforms\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Show features, dashboards, and pricing.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eStartup Websites\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Launch product-focused landing pages.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProductivity Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Highlight workflows, automation, and collaboration.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDigital Platforms\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Clearly explain product capabilities and integrations.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHero Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Headline with primary and secondary call-to-action buttons.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTrusted By Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Logo strip to show credibility and adoption.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePreview Card\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Visual blocks to present product interface and workflows.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeature Sections\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Grid-based layouts explaining core product functionality.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Clear plan comparison with structured tiers.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: User feedback to support trust and decision-making.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Content area for updates, guides, and SEO growth.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCTA Sections\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003e: Focused blocks designed to drive user actions.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Simple form for inquiries and lead capture.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNewsletter Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Email collection for updates and retention.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Works across desktop, tablet, and mobile devices.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: To maintain a consistent and scalable UI.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeatures\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAbout\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Details\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSign In\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSign Up\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e404\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaasSpace is a Tailwind React SaaS landing page template made for SaaS products and digital platforms. The template offers important needs, such as showcasing features, giving users a preview, and building trust. It gives SaaS products a solid base to start and grow.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"8a:T2398,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSynth AI is a React website template designed for AI business assistant platforms, workflow automation tools, and SaaS products. It provides a complete website structure to present your product, explain how it works, and guide users to sign up or demo.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template works well for teams building tools that automate tasks, manage operations, or provide insights. It is suitable for both early-stage products and growing platforms that need a clear and structured website.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSynth AI is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React handles the structure and interactions, while Tailwind CSS manages layout and styling through utility classes. Tailgrids provides reusable UI components, including feature blocks, integration sections, testimonials, and call-to-action. This keeps the code easy to manage and extend.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Business Assistant Platforms\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Show automation, analytics, and assistant workflows.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eWorkflow Automation Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Explain task automation, integrations, and the setup process.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS Products\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Launch product websites with clear features and pricing.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProductivity Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Highlight task management, insights, and efficiency features.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeature Sections\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Explain product capabilities in a clear and simple way.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSetup Flow\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Show step-by-step onboarding and how users get started.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIntegrations Section:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Display tools like GitHub, Notion, Slack, and Stripe.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTestimonials\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Share user or client feedback.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFAQ Section\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Answer common questions about usage and setup.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing Pages\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Clearly show plan options.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCall-to-Action Sections\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Guide users to sign up or request a demo.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Pages\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Share updates, guides, and product insights.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Works across desktop, tablet, and mobile screens.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Maintain consistent layout across pages.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHome\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFeatures\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAbout\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eBlog Details\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContact\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e404 Page\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify ql-indent-1\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFooter Section\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSynth AI is a React website template built for teams launching AI and automation products. It offers a clean structure, a simple c
3ontent flow, and reusable components.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template covers common needs, such as explaining features, demonstrating integrations, and guiding users toward conversion. It gives you a solid starting point for building and growing a product website.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"8b:T250b,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashSpace is a React admin dashboard template built for SaaS applications, internal tools, and data-driven platforms. It provides a complete dashboard layout for displaying metrics, tracking activity, and managing data clearly.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template is for teams that work with analytics, user data, and operational dashboards. It works well for both new products and well-known platforms that need a structured admin interface.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe layout of DashSpace is simple, with a sidebar, header, and main content section. It starts with key numbers and then moves to charts, tables, and other data. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIt is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React handles layout and interactions, and Tailwind CSS handles styling with utility classes. TailGrids provides reusable UI components, including cards, charts, tables, and navigation elements. This keeps the interface consistent and easy to extend.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS Dashboards\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Track revenue, users, and performance metrics.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAdmin Panels\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Manage users, data, and application activity.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eE-commerce Dashboards\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Monitor orders, sales, and product performance.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAnalytics Platforms\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Visualize data with charts and reports.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eInternal Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Build dashboards for operations and team workflows.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eKPI Cards\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Display key metrics like revenue, users, and conversion rates.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAnalytics Charts\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Show performance data with bar and donut charts.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eData Tables\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Manage and display structured data such as orders or users.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMap\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Display user or sales distribution by region.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSidebar Navigation\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Organize pages and dashboard sections clearly.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHeader Toolbar\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Includes search, notifications, and access to the user profile.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Works across desktop, tablet, and mobile screens.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Maintain consistency across the dashboard.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections and Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashboard\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCalendar\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTables\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eForm Elements\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eForm Layouts\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSettings Page\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePricing Table\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTeam\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProfile\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCharts\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAuthentication Pages\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e404 Page\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashSpace is a React admin dashboard template built for managing data-heavy applications.\u003c/span\u003e\u003cspan style=\"background-color: rgb(255, 255, 255); color: rgb(0, 0, 0);\"\u003e It offers clear structure, reusable components, and flexible styling with Tailwind CSS.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template supports common dashboard needs, including metric tracking, data visualization, and user management. \u003c/span\u003e\u003cspan style=\"background-color: rgb(255, 255, 255); color: rgb(0, 0, 0);\"\u003eIt provides a stable foundation \u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003efor building admin panels and SaaS dashboards.\u003c/span\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"8c:T2242,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Chat is a React chat interface template built for AI assistant applications, chatbot platforms, and AI-powered tools. It provides a complete UI framework for managing conversations, organizing chats, and interacting with AI models.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template is designed for teams building chat-based products that require a clean interface and smooth user interaction. It works well for simple AI tools and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003emulti-model chat platforms.\u003c/strong\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIt follows a focused layout with a sidebar and a main chat area. The sidebar handles navigation, projects, and conversation history, while the main area centers on chat input and user interaction. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Chat is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e and \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React manages layout and interactions, while Tailwind CSS controls styling through utility classes. TailGrids provides reusable UI elements, including sidebar components, input fields, buttons, and panels.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMulti-model AI Chat Applications\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Build chat interfaces with input, history, and model selection.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Assistant Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Create conversational tools for tasks, queries, and workflows.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS AI Products\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Launch chat-based features with structured UI.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDeveloper Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Build prompt-based tools with quick actions and chat history.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAll-in-One AI Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Use chat interfaces for team workflows and automation.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eChat Interface Layout\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Sidebar and main chat area for clear interaction flow.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eConversation History\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Organize chats by time and access previous messages.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProject Sections\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Group chats organized by project or category.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMulti-Line Chat Input\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Supports longer prompts with file and tool options.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eModel Selector\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Switch between available AI models.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eQuick Actions\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Predefined actions for common tasks like search or content generation.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSidebar Navigation\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Manage chats, projects, and settings from one place.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUser Panel\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Display account details and plan information.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Works across desktop and mobile devices.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Maintain consistency across the interface.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Sections\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSidebar\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMobile Header\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eChat Screen\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eChat Input Area\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eQuick Actions\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Chat is a React template built for chat-based AI products and assistant tools. It focuses on a
3simple layout, clear interaction, and organized conversation flow.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template supports common chat interface needs, including managing conversations, selecting models, and handling user input. It provides a strong starting point for building AI chat applications.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"8d:T22d0,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCMS Dashboard is a React admin dashboard template built for content platforms, membership sites, and subscription-based products. It provides a complete dashboard layout to track revenue, manage content, and monitor user activity.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template is designed for teams running content businesses that rely on subscriptions and recurring revenue. It works well for newsletters, blogs, digital products, and creator platforms.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIt follows a structured layout with a sidebar, header, and data-focused main area. It starts with key revenue metrics, followed by charts and tables that help teams understand performance and user activity.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCMS Dashboard is built with \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailwind CSS \u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eand \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReact UI components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e. React manages layout and interactions, while Tailwind CSS controls styling through utility classes. TailGrids provides reusable components, including charts, tables, cards, and navigation elements. This keeps the dashboard consistent and easy to scale.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eContent Platforms\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Track revenue, subscriptions, and user growth.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMembership Websites:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Manage members, plans, and payments.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eNewsletter Platforms:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Monitor subscribers and recurring income.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCreator Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Analyze audience and monetization performance.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDigital Publishing Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Manage posts, drafts, and scheduled content.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eRevenue KPI Cards\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Display key metrics, including monthly revenue and subscriber count.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMRR Chart\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Visualize recurring revenue trends over time.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSubscription Breakdown\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Show the distribution of the show plan across free and paid tiers.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003ePayments Table\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Track member payments with plan and date details.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAI Assistant Pane\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003el: Access a built-in assistant for quick actions and insights.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSidebar Navigation\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Organize dashboard pages and content sections.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHeader Toolbar\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Includes search, quick actions, and user controls.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Works across desktop and tablet screens.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e: Maintain consistent structure across pages.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTemplate Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashboard\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAnalytics\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAll Post\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCreate Post\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDrafts\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eScheduled\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMembers\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eRevenue\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCMS Dashboard is a React template built for managing content and subscription businesses. It focuses on clear data presentation, simple navigation, and structured workflows.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThe template supports common needs such as tracking revenue, managing content, and analyzing subscribers. It provides a strong starting point for building content and monetization dashboards.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"8e:T267e,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFile Manager is a template built on React designed for business SaaS tools, cloud file storage services, and document management systems. It allows for the rapid creation of a dashboard for the management of files, folders, storage, and user activities.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eThis template has a clear modern dashboard structure. It starts with a general overview of storage and its activity, and then proceeds to sections for managing files, such as My Files, Shared Files, Favorites, and Recent. The user can organize files and manage access with folder views, a trash can, and a settings page.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eThe dashboard is designed using \u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eTailwind CSS\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e and React UI. React handles layout and interactions, and Tailwind CSS handles utility-class-based styling. \u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTailgrids provides reusable UI components, including feature blocks, integration sections, testimonials, and call-to-action. The design remains consistent and is highly extensible.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2 class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003ePlatforms for Cloud Storage\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Team management, storage tracking, folder organization, and file uploads.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eManagement of Team Documents:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e Folders can be collaborated on, access can be shared, and activities can be monitored.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eFile Management Tools\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Systems with multiple users, defined roles, storage caps, and available upgrades.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eManagement of Digital Assets\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Storage is organized, and images, videos, documents, and files are accessible and can be filtered.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\" class=\"ql-align-justify\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eRepositories for Project Files\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Organization by folders and shared access with a recent files feature.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/strong\u003e\u003c/p\u003e\u003col\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eDashboard Overview\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Includes a storage usage indicator, storage breakdown by document, image, video, and audio, recent files and folders, member status, and recent activity.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eMy Files\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: View as folders or in grid or list format, see file count and size, view by type, size, and date modified, includes image, document, video, and XLS file type tabs\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eShared File\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003es: View as folders (includes starred favorites), see as a grid or in file type icon view with name, size, and timestamp\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eFavorite\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Access personal collections of starred folders and files, and view bookmarks for documents, images, spreadsheets, and text files\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eRecent\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Stated as most recently opened, includes folders and files, and includes grid view, file type, size, and timestamp\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eTrash\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Deleted files and folders, will auto-delete in 30 days, includes individual restore, permanently delete, size, and type\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eFolder View\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Display individual filters by file grid with sort and breadcrumb path\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eSettings\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Includes workspace name, default upload folder, storage, settings, permissions, integrations, help, and support. The user profile menu includes a workspace switcher, add workspace, theme toggle, and sign out\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eSidebar\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Collapsing navigation includes Overview, My Files, Shared Files, Favorites, Recent, and Trash. My Files includes a list of named folders and an action button for creating a New Folder. \u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eResponsive Design\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: optimizations for both desktop and tablet.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eReusable React Components\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e: Modular sections that can be changed, moved, or expanded.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003cp\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashboard Pages\u003c/strong\u003e\u003c/p\u003e\u003col\u003e\u003cli data-list=\"ordered\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eOverview\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"ordered\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMy Files\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"ordered\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eShared Files\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"ordered\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFavorite\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"ordered\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eRecent\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"ordered\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eTrash\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"ordered\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eFolder View\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"ordered\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSettings (General, Storage, Permissions, Integrations, Help and
3Support)\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eFile Manager is a React + Tailwind dashboard template for organizing files, managing storage, and controlling user access. It prioritizes easy navigation, structured workflows, and clear file organization.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eThe template offers core functionalities for a good cloud storage and file management system, such as file storage and sharing, activity tracking, and folder management. It provides a solid foundation for developing such systems.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"8f:T2113,"])</script>
3<script>self.__next_f.push([1,"\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eLytic is a React SaaS analytics dashboard template designed specifically for SaaS products, marketing agencies, and growth teams. It allows you to consolidate tracking for traffic, revenue, campaigns, and users into one dashboard.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eYou get a pre-built dashboard template that allows you to work on core logic rather than spending time building UI elements from scratch. \u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eThe template has a clear structure. It contains an overview of the main metrics and several other detailed sections for analytics, revenue, campaigns, and users. This makes it quite simple to see the performance with details.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003eThe dashboard is designed using Tailwind CSS and React UI. React takes care of the layout and interactions, and Tailwind CSS handles utility class-based styling. The dashboard uses ApexCharts for all charts and data visualization. This ensures that the dashboard remains uniform and easy to manage.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUse Cases\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSaaS Analytics Dashboards:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Revenue, MRR, ARR, signups, conversions.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eMarketing Analytics Tools:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Traffic, channels, sessions, engagement.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCampaign Management Platforms:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Track performance, clicks, and conversions across channels.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eRevenue Tools:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e View subscription data, revenue growth, and goals.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUser Management:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Users, roles, plans, and activity.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eProduct Analytics:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Behavior metrics, bounce rate, sessions, and location data.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);
3\"\u003eKey Features\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eOverview Dashboard:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Key metrics like revenue, MRR, signups, conversions, and top pages.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAnalytics Dashboard:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Traffic trends, device types, location of users, and engagement.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eRevenue Dashboard:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e \u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(31, 41, 55);\"\u003e Revenue, ARR, ARPU, growth, and subs.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCampaign Dashboard: \u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCampaigns, clicks, conversions, and channels.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUsers Dashboard:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Stats, tables, status, and invites.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSettings:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Accounts, teams, billing, integrations, API keys, and access.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eGlobal Controls:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Search, date picker, refresh, display, and exporting as CSV.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCharts and Visualizations:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Area, donut, map, heatmap, and sparkline charts.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eResponsive Layout:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Works across desktop and tablet screens.\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cstrong style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eReusable React Components:\u003c/strong\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003e Easy to update, reorder, and extend sections.\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003ch2\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eDashboard Pages\u003c/span\u003e\u003c/h2\u003e\u003col\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eOverview\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eAnalytics\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eRevenue\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eCampaign\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eUsers\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eSettings (General, Account, Team, Notification, Plan and Billing, Integrations, API Keys, Security and Access)\u003c/span\u003e\u003c/li\u003e\u003cli data-list=\"bullet\"\u003e\u003cspan class=\"ql-ui\" contenteditable=\"false\"\u003e\u003c/span\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eHelp Center\u003c/span\u003e\u003c/li\u003e\u003c/ol\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eLytic is a React dashboard template for SaaS and data-driven teams. It focuses on clear structure, simple navigation, and easy data tracking.\u003c/span\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cbr\u003e\u003c/p\u003e\u003cp class=\"ql-align-justify\"\u003e\u003cspan style=\"background-color: transparent; color: rgb(0, 0, 0);\"\u003eIt covers key needs like monitoring performance, managing users, and understanding growth. It gives you a strong starting point for building and scaling your analytics dashboard.\u003c/span\u003e\u003c/p\u003e\u003cp\u003e\u003cbr\u003e\u003c/p\u003e"])</script>
3<script>self.__next_f.push([1,"3a:[\"$\",\"section\",null,{\"className\":\"mt-20 overflow-hidden\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative mx-auto w-full max-w-[1456px]\",\"children\":[\"$\",\"div\",null,{\"className\":\"relative grid grid-cols-[1rem_auto_1rem] md:grid-cols-[2.5rem_auto_2.5rem] bg-white [--pattern-fg:var(--border-1)]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"col-start-2 w-full max-w-[1600px] min-w-0\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) top-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"relative p-5 pt-10 sm:p-10 sm:pt-20\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute bg-(--pattern-fg) bottom-0 left-1/2 h-px w-[200vw] -translate-x-1/2 [--pattern-fg:var(--border-1)]\"}],[\"$\",\"div\",null,{\"className\":\"w-full max-w-[800px]\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mb-4\",\"children\":[\"$\",\"span\",null,{\"className\":\"inline-flex items-center justify-center gap-1.5 rounded-lg px-3 py-1.5 font-mono text-sm font-medium text-tg-text-color-secondary\",\"style\":{\"boxShadow\":\"0 4px 8px 0 rgba(41, 41, 41, 0.06), 0 2px 4px 0 rgba(41, 41, 41, 0.04), 0 1px 2px 0 rgba(41, 41, 41, 0.04), 0 0 0 1px rgba(41, 41, 41, 0.08), 0 -0.5px 0.5px 0 rgba(41, 41, 41, 0.08) inset\"},\"children\":[[\"$\",\"svg\",null,{\"className\":\"size-4.5\",\"viewBox\":\"0 0 18 18\",\"fill\":\"none\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"children\":[\"$\",\"path\",null,{\"d\":\"M15 10.9995L3 10.9995M9 15V10.9999M3 4.125L3 13.875C3 14.4963 3.50368 15 4.125 15H13.875C14.4963 15 15 14.4963 15 13.875V4.125C15 3.50368 14.4963 3 13.875 3L4.125 3C3.50368 3 3 3.50368 3 4.125Z\",\"stroke\":\"currentColor\",\"strokeWidth\":\"1.3\",\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\"}]}],\"Templates\"]}]}],[\"$\",\"h2\",null,{\"className\":\"mb-4.5 text-2xl font-medium -tracking-[1.5px] text-tg-title-color sm:text-3xl md:text-4xl lg:text-[40px]/[48px] max-w-[550px] w-full\",\"children\":\"Beautifully Designed Templates for Real Projects\"}],[\"$\",\"div\",null,{\"className\":\"text-sm -tracking-[.2px] text-tg-text-color-secondary xs:text-base md:text-lg *:[\u0026\u003estrong]:font-medium *:[\u0026\u003estrong]:text-tg-title-color\",\"children\":[\"$\",\"p\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"Launch faster with ready-to-ship React templates and Figma source, built on Tailgrids UI components for real product workflows.\"}}]}]]}]]}],[\"$\",\"div\",null,{\"className\":\"relative overflow-hidden bg-gray-100\",\"children\":[\"$\",\"$L7d\",null,{\"data\":\"$undefined\",\"templates\":[{\"_id\":\"696dfa935fa6635953bd11d3\",\"name\":\"NexStudio - React Agency Website Template\",\"slug\":\"nexstudio\",\"description\":\"$7e\",\"shortDescription\":\"React agency website template for digital studios and product teams. Includes services, projects, testimonials, and blog pages. Built with Tailwind CSS.\",\"builtWith\":[\"React\"],\"pagesIncluded\":[\"Home\",\"Projects\",\"Services\",\"About\",\"Blog\",\"Contact\",\"Testimonials\",\"Use Cases\",\"Footer\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1786247018741-1768815243783-nexstudio-lg.webp\"],\"previewUrl\":\"https://nexstudio.demos.tailgrids.com/\",\"meta\":{\"title\":\"NexStudio - React Agency Website Template\",\"description\":\"React agency website template for digital studios and product teams. Includes services, projects, testimonials, and blog pages. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1768814928295-nexstudio.png\"},\"availableVariants\":[\"react\"],\"createdAt\":\"2026-01-19T09:34:11.281Z\",\"updatedAt\":\"2026-08-09T03:43:44.742Z\",\"__v\":0,\"sortOrder\":0,\"codeFiles\":[{\"_id\":\"6a77f770aebe485dbf016692\",\"templateId\":\"696dfa935fa6635953bd11d3\",\"filename\":\"nex-studio-react-main.zip\",\"fileKey\":\"1772605744513-nex-studio-react-main.zip\",\"createdAt\":\"2026-08-09T03:43:44.846Z\",\"updatedAt\":\"2026-08-09T03:43:44.846Z\"}]},{\"_id\":\"696dfccd5fa6635953bd1221\",\"name\":\"Fincash - React Fintech Website Templates for Finance Apps\",\"slug\":\"fincash\",\"description\":\"$7f\",\"shortDe
3scription\":\"Finance website template built with React for fintech apps. Includes features, pricing, testimonials, Contact, and FAQs. Designed for payments and money management platforms.\",\"builtWith\":[\"React\"],\"pagesIncluded\":[\"Home\",\"Features\",\"Pricing\",\"App Workflow\",\"Testimonials\",\"FAQs\",\"Contact\",\"Footer\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1769589368473-fincash-lg.png\"],\"previewUrl\":\"https://fincash.demos.tailgrids.com/\",\"meta\":{\"title\":\"Fincash - React Fintech Website Templates for Finance Apps\",\"description\":\"Finance website template built with React for fintech apps. Includes features, pricing, testimonials, Contact and FAQs. Designed for payments and money management platforms.\",\"imageUrl\":\"https://assets.tailgrids.com/1768817558627-fincash-lg.png\"},\"availableVariants\":[\"react\"],\"createdAt\":\"2026-01-19T09:43:41.077Z\",\"updatedAt\":\"2026-03-04T08:34:51.672Z\",\"__v\":0,\"sortOrder\":0,\"codeFiles\":[{\"_id\":\"69a7eeab2f08f686a0db6fe7\",\"templateId\":\"696dfccd5fa6635953bd1221\",\"filename\":\"fincash-react-main.zip\",\"fileKey\":\"1772613288218-fincash-react-main.zip\",\"createdAt\":\"2026-03-04T08:34:51.759Z\",\"updatedAt\":\"2026-03-04T08:34:51.759Z\"}]},{\"_id\":\"696e0d645fa6635953bd12ec\",\"name\":\"WriteMate AI - React AI Website Template for Multi-LLM Content Platforms\",\"slug\":\"writemate-ai\",\"description\":\"$80\",\"shortDescription\":\"React AI website template for AI writing tools, content, and chatbot platforms. Includes features, pricing, docs, support, Use Cases, and testimonials sections.\\n\",\"builtWith\":[\"React\"],\"pagesIncluded\":[\"Home\",\"Features\",\"Use Cases\",\"Pricing\",\"Docs\",\"Support\",\"Testimonials\",\"FAQs\",\"CTA\",\"Footer\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1771816318893-writemate-lg.png\"],\"previewUrl\":\"https://writemate.demos.tailgrids.com/\",\"meta\":{\"title\":\"WriteMate AI - React AI Website Template for Multi-LLM Content Platforms\",\"description\":\"React AI website template for AI writing tools, content, and chatbot platforms. Includes features, pricing, docs, support, Use Cases, and testimonials sections.\",\"imageUrl\":\"https://assets.tailgrids.com/1771816351968-writemate-meta.png\"},\"availableVariants\":[\"react\"],\"createdAt\":\"2026-01-19T10:54:28.112Z\",\"updatedAt\":\"2026-02-24T09:54:05.398Z\",\"__v\":0,\"sortOrder\":0,\"codeFiles\":[{\"_id\":\"699d753d2f08f686a0d68f6f\",\"templateId\":\"696e0d645fa6635953bd12ec\",\"filename\":\"writemate-ai-react.zip\",\"fileKey\":\"1771926841258-writemate-ai-react.zip\",\"createdAt\":\"2026-02-24T09:54:05.478Z\",\"updatedAt\":\"2026-02-24T09:54:05.478Z\"}]},{\"_id\":\"696e0f185fa6635953bd133e\",\"name\":\"SaaSly - Modern React SaaS Website Template\",\"slug\":\"saasly\",\"description\":\"$81\",\"shortDescription\":\"React SaaS website template for SaaS products. Includes features, integrations, pricing, testimonials, FAQs, login, and trial CTAs. Built with Tailwind CSS.\",\"builtWith\":[\"React\"],\"pagesIncluded\":[\"Home\",\"Features\",\"Pricing\",\"About\",\"Contact\",\"Start Free Trial\",\"Use Cases\",\"Integrations\",\"Testimonials\",\"FAQs\",\"Footer\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1768820389261-saasly-lg.png\"],\"previewUrl\":\"https://saasly.demos.tailgrids.com/\",\"meta\":{\"title\":\"SaaSly - Modern React SaaS Website Template\",\"description\":\"React SaaS website template for SaaS products. Includes features, integrations, pricing, testimonials, FAQs, login, and trial CTAs. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1768820374408-saasly.png\"},\"availableVariants\":[\"react\"],\"createdAt\":\"2026-01-19T11:01:44.354Z\",\"updatedAt\":\"2026-03-04T06:27:04.876Z\",\"__v\":0,\"sortOrder\":0,\"codeFiles\":[{\"_id\":\"69a7d0b82f08f686a0db5910\",\"templateId\":\"696e0f185fa6635953bd133e\",\"filename\":\"saasly-react-main.zip\",\"fileKey\":\"1772605618224-saasly-react-main.zip\",\"createdAt\":\"2026-03-04T06:27:04.954Z\",\"updatedAt\":\"2026-03-04T06:27:04.954Z\"}]},{\"_id\":\"696f2c140f11215fc4b2b182\",\"name\":\"Neoxa - React SaaS Dashboard Template\",\"slug\":\"neoxa\",\"description\":\"$82\",\"shortDe
3scription\":\"React SaaS dashboard template built with Tailwind CSS. Includes dashboards, users, orders, invoices, analytics, auth pages, and pre-built UI components.\",\"builtWith\":[\"React\",\"Tailwind \"],\"pagesIncluded\":[\"Dashboard\",\"Users\",\"Orders\",\"Invoices\",\"Analytics\",\"Support Tickets\",\"Settings\",\"Profile\",\"Security\",\"App Preferences\",\"Sign In\",\"Sign Up\",\"Reset Password\",\"Two Step Verification\"],\"tags\":[{\"_id\":\"696df49b5fa6635953bd1131\",\"name\":\"Dashboard \",\"slug\":\"dashboard \",\"ogTitle\":\"\",\"ogDescription\":\"\",\"ogImageLink\":\"\",\"createdAt\":\"2026-01-19T09:08:43.528Z\",\"updatedAt\":\"2026-01-19T09:08:43.528Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1768893422021-neox-lg.png\"],\"previewUrl\":\"https://neoxa.demos.tailgrids.com\",\"meta\":{\"title\":\"Neoxa - React SaaS Dashboard Template\",\"description\":\"React SaaS dashboard template built with Tailwind CSS. Includes dashboards, users, orders, invoices, analytics, auth pages, and pre-built UI components.\",\"imageUrl\":\"https://assets.tailgrids.com/1768893430523-neox.png\"},\"availableVariants\":[\"react\"],\"planIds\":[],\"createdAt\":\"2026-01-20T07:17:40.875Z\",\"updatedAt\":\"2026-03-04T06:30:26.852Z\",\"__v\":0,\"sortOrder\":0,\"codeFiles\":[{\"_id\":\"69a7d1822f08f686a0db59b8\",\"templateId\":\"696f2c140f11215fc4b2b182\",\"filename\":\"neoxa-react-main.zip\",\"fileKey\":\"1772605824042-neoxa-react-main.zip\",\"createdAt\":\"2026-03-04T06:30:26.928Z\",\"updatedAt\":\"2026-03-04T06:30:26.928Z\"}]},{\"_id\":\"696df6285fa6635953bd115c\",\"name\":\"TechSelf - React Electronic Store E-Commerce Template\",\"slug\":\"techself\",\"description\":\"$83\",\"shortDescription\":\"Launch an electronics and gadget store using a React ecommerce template with product pages, categories, cart, and checkout. Styled with Tailwind CSS.\",\"builtWith\":[\"React\"],\"pagesIncluded\":[\"Home\",\"Shop\",\"Products\",\"Categories\",\"Sale\",\"Product Page\",\"Shopping Cart\",\"Checkout\",\"FAQs\",\"Testimonials\",\"Newsletter\",\"Contact\",\"Footer\"],\"tags\":[{\"_id\":\"696df45b5fa6635953bd1120\",\"name\":\"Ecommerce\",\"slug\":\"ecommerce\",\"ogTitle\":\"\",\"ogDescription\":\"\",\"ogImageLink\":\"\",\"createdAt\":\"2026-01-19T09:07:39.914Z\",\"updatedAt\":\"2026-01-19T09:07:39.914Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1768978317738-techself.png\"],\"previewUrl\":\"https://techself.demos.tailgrids.com/\",\"meta\":{\"title\":\"TechSelf - React Electronics E-Commerce Template\",\"description\":\"Launch an electronics and gadget store using a React ecommerce template with product pages, categories, cart, and checkout. Styled with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1768978322326-techself.png\"},\"availableVariants\":[\"react\"],\"createdAt\":\"2026-01-19T09:15:20.305Z\",\"updatedAt\":\"2026-03-04T06:27:32.613Z\",\"__v\":0,\"sortOrder\":1,\"codeFiles\":[{\"_id\":\"69a7d0d42f08f686a0db5953\",\"templateId\":\"696df6285fa6635953bd115c\",\"filename\":\"tech-self-react-main.zip\",\"fileKey\":\"1772605650586-tech-self-react-main.zip\",\"createdAt\":\"2026-03-04T06:27:32.691Z\",\"updatedAt\":\"2026-03-04T06:27:32.691Z\"}]},{\"_id\":\"696f4507f9f239d45f3b313d\",\"name\":\"Originix - React Startup and Business Website Template\",\"slug\":\"originix\",\"description\":\"$84\",\"shortDescription\":\"React business website template for startups and growing companies. Includes services, process, testimonials, blog, FAQs, and lead capture sections.\",\"builtWith\":[\"React\",\"Tailwind\"],\"pagesIncluded\":[\"Home\",\"Services\",\"About\",\"Blog\",\"Contact\",\"Process\",\"Testimonials\",\"FAQs\",\"Newsletter\",\"Footer\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1768899760800-originx-lg.png\"],\"previewUrl\":\"https://originx.demos.tailgrids.com/\",\"meta\":{\"title\":\"Originix - React Startup and Business Website Template\",\"description\":\"React business website template for startups and growing companies. Includes services, process, testimonials, blog, FAQs, and lead capture sections.\",\"imageUrl\":\"https://assets.tailgrids.com/1768899782545-originx.png\"},\"availableVariants\":[\"react\"],\"planIds\":[],\"createdAt\":\"2026-01-20T09:04:07.603Z\",\"updatedAt\":\"2026-03-04T06:26:01.450Z\",\"__v\":0,\"sortOrder\":2,\"codeFiles\":[{\"_id\":\"69a7d0792f08f686a0db58e9\",\"templateId\":\"696f4507f9f239d45f3b313d\",\"filename\":\"originix-react-main.zip\",\"fileKey\":\"1772605558352-originix-react-main.zip\",\"createdAt\":\"2026-03-04T06:26:01.534Z\",\"updatedAt\":\"2026-03-04T06:26:01.534Z\"}]},{\"_id\":\"696f42b8f9f239d45f3b30ae\",\"name\":\" Fundex - React Personal Finance Dashboard Template\",\"slug\":\"fundex\",\"description\":\"$85\",\"shortDe
3scription\":\"React finance dashboard template for personal tools built with Tailwind CSS. Track income, expenses, budgets, transactions, cash flow, analytics, and reports.\",\"builtWith\":[\"React\",\"Tailwind\"],\"pagesIncluded\":[\"Dashboard\",\"Transactions\",\"Analytics\",\"Budgets\",\"Notifications\",\"Profile\",\"Cards \u0026 Accounts\",\"Settings\",\"Security\",\"App Preferences\",\"Data Management\",\"Legal \u0026 Support\"],\"tags\":[{\"_id\":\"696df49b5fa6635953bd1131\",\"name\":\"Dashboard \",\"slug\":\"dashboard \",\"ogTitle\":\"\",\"ogDescription\":\"\",\"ogImageLink\":\"\",\"createdAt\":\"2026-01-19T09:08:43.528Z\",\"updatedAt\":\"2026-01-19T09:08:43.528Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1768900503106-fundex-lg.png\"],\"previewUrl\":\"https://fundex.demos.tailgrids.com/\",\"meta\":{\"title\":\"Fundex - React Personal Finance Dashboard Template\",\"description\":\"React finance dashboard template for personal tools built with Tailwind CSS. Track income, expenses, budgets, transactions, cash flow, analytics, and reports.\",\"imageUrl\":\"https://assets.tailgrids.com/1768900510237-fundex.png\"},\"availableVariants\":[\"react\"],\"planIds\":[],\"createdAt\":\"2026-01-20T08:54:16.015Z\",\"updatedAt\":\"2026-03-04T06:24:49.447Z\",\"__v\":0,\"sortOrder\":5,\"codeFiles\":[{\"_id\":\"69a7d0312f08f686a0db58be\",\"templateId\":\"696f42b8f9f239d45f3b30ae\",\"filename\":\"fundex-react-main.zip\",\"fileKey\":\"1772605483002-fundex-react-main.zip\",\"createdAt\":\"2026-03-04T06:24:49.528Z\",\"updatedAt\":\"2026-03-04T06:24:49.528Z\"}]},{\"_id\":\"699c1e602f08f686a0d5dc49\",\"name\":\"AISpace - Modern React AI SaaS Landing Page Template\",\"slug\":\"ai-space\",\"description\":\"$86\",\"shortDescription\":\"AISpace is a Modern React AI SaaS landing page template for developer tools and startups. Includes features, pricing, blog, and CTAs. Built with Tailwind CSS.\",\"builtWith\":[\"React\",\"Tailwind\",\"Framer Motion\"],\"pagesIncluded\":[\"Home\",\"Features\",\"Pricing\",\"Contact\",\"About\",\"Blog Grid\",\"Blog Details\",\"SignIn\",\"SignUp\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1771839057157-aispace.png\"],\"previewUrl\":\"https://aispace.demos.tailgrids.com\",\"meta\":{\"title\":\"AISpace - Modern React AI SaaS Landing Page Template\",\"description\":\"AISpace is a Modern React AI SaaS landing page template for developer tools and startups. Includes features, pricing, blog, and CTAs. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1771839050402-aispace.png\"},\"availableVariants\":[\"react\"],\"sortOrder\":6,\"createdAt\":\"2026-02-23T09:31:12.232Z\",\"updatedAt\":\"2026-04-04T07:19:58.414Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"69d0bb9e7fd50ba5d174b1a1\",\"templateId\":\"699c1e602f08f686a0d5dc49\",\"filename\":\"ai-space.zip\",\"fileKey\":\"1771839017548-ai-space.zip\",\"createdAt\":\"2026-04-04T07:19:58.491Z\",\"updatedAt\":\"2026-04-04T07:19:58.491Z\"}]},{\"_id\":\"699c23612f08f686a0d5dfdb\",\"name\":\"BizSpace â Professional Agency \u0026 Business Landing Page\",\"slug\":\"biz-space\",\"description\":\"$87\",\"shortDescription\":\"BizSpace is a professional, dynamic agency focused business landing page template built with React and Tailwind CSS by Tailgrids, designed for digital agencies, creative studios, marketing firms, or branding consultancy websites.\\n\",\"builtWith\":[\"React\",\"Tailwind\",\"Framer Motion\"],\"pagesIncluded\":[\"Home\",\"About\",\"Services\",\"Portfolio\",\"Portfolio Details\",\"Contact\",\"Blog\",\"Blog Details\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1771840072842-bizspace.png\"],\"previewUrl\":\"https://bizspace.demos.tailgrids.com\",\"meta\":{\"title\":\"BizSpace - React Business Consulting Website Template\",\"description\":\"React business consulting website template for agencies and service firms. Includes services, portfolio, team, testimonials, and contact pages. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1771840080362-aispace.png\"},\"availableVariants\":[\"react\"],\"sortOrder\":8,\"createdAt\":\"2026-02-23T09:52:33.338Z\",\"updatedAt\":\"2026-04-04T07:18:18.355Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"69d0bb3a7fd50ba5d174b061\",\"templateId\":\"699c23612f08f686a0d5dfdb\",\"filename\":\"biz-space.zip\",\"fileKey\":\"1771840181151-biz-space.zip\",\"createdAt\":\"2026-04-04T07:18:18.435Z\",\"updatedAt\":\"2026-04-04T07:18:18.435Z\"}]},{\"_id\":\"699c20882f08f686a0d5de0a\",\"name\":\"AppSpace - Modern React Mobile App Landing Page Template\",\"slug\":\"app-space\",\"description\":\"$88\",\"shortDe
3scription\":\"Modern React mobile app landing page template for SaaS and productivity apps. Includes features, pricing, testimonials, and download CTAs. Built with Tailwind CSS.\",\"builtWith\":[\"React\",\"Tailwind\",\"Framer Motion\"],\"pagesIncluded\":[\"Home\",\"Feature\",\"Sign In\",\"Sign Up\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1771839557355-appspace.png\"],\"previewUrl\":\"https://appspace.demos.tailgrids.com\",\"meta\":{\"title\":\"AppSpace - Modern React Mobile App Landing Page Template\",\"description\":\"Modern React mobile app landing page template for SaaS and productivity apps. Includes features, pricing, testimonials, and download CTAs. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1771839563053-aispace.png\"},\"availableVariants\":[\"react\"],\"sortOrder\":9,\"createdAt\":\"2026-02-23T09:40:24.380Z\",\"updatedAt\":\"2026-04-08T06:18:05.584Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"69d5f31d54ec191cf28ea96b\",\"templateId\":\"699c20882f08f686a0d5de0a\",\"filename\":\"app-space.zip\",\"fileKey\":\"1771839616578-app-space.zip\",\"createdAt\":\"2026-04-08T06:18:05.681Z\",\"updatedAt\":\"2026-04-08T06:18:05.681Z\"}]},{\"_id\":\"699c170dac378e7f73574eca\",\"name\":\"SaasSpace - Modern React SaaS Landing Page Template\",\"slug\":\"saass-pace\",\"description\":\"$89\",\"shortDescription\":\"Modern React SaaS landing page template for platforms and startups. Includes features, pricing, testimonials, blog, and CTAs. Built with Tailwind CSS.\",\"builtWith\":[\"React\",\"Tailwind\",\"Framer Motion\"],\"pagesIncluded\":[\"Home\",\"Features\",\"Pricing\",\"Blog\",\"Blog Details\",\"Contact\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1771837299391-saasspace.png\"],\"previewUrl\":\"https://saasspace.demos.tailgrids.com\",\"meta\":{\"title\":\"SaasSpace - Modern React SaaS Landing Page Template\",\"description\":\"Modern React SaaS landing page template for platforms and startups. Includes features, pricing, testimonials, blog, and CTAs. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1771837023431-saasspace.png\"},\"availableVariants\":[\"react\"],\"sortOrder\":10,\"createdAt\":\"2026-02-23T08:59:57.817Z\",\"updatedAt\":\"2026-08-09T03:48:46.438Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"6a77f89eaebe485dbf016740\",\"templateId\":\"699c170dac378e7f73574eca\",\"filename\":\"saas-space-main.zip\",\"fileKey\":\"1786247323159-saas-space-main.zip\",\"createdAt\":\"2026-08-09T03:48:46.517Z\",\"updatedAt\":\"2026-08-09T03:48:46.517Z\"}]},{\"_id\":\"69cb42255ca8dc5aaec15d2d\",\"name\":\"Synth AI - React AI Business Assistant Website Template\",\"slug\":\"synth-ai\",\"description\":\"$8a\",\"shortDescription\":\"React AI website template for AI business assistant platforms. Includes features, integrations, pricing, blog, testimonials, and FAQs. Built with Tailwind CSS.\",\"builtWith\":[\"React, Tailwind CSS, Framer Motion\"],\"pagesIncluded\":[\"Home\",\"Features\",\"Pricing\",\"About\",\"Blog\",\"Blog Details\",\"Contact\"],\"tags\":[{\"_id\":\"69686590bb5af5bb0dc35e14\",\"name\":\"Marketing \",\"slug\":\"marketing\",\"ogTitle\":\"Test Title \",\"ogDescription\":\"Test Descriptions\",\"ogImageLink\":\"https://assets.tailgrids.com/1768449397264-og.png\",\"createdAt\":\"2026-01-15T03:57:04.333Z\",\"updatedAt\":\"2026-01-15T03:57:04.333Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/17749284149
365-synth-ai-lg.png\"],\"previewUrl\":\"https://synthai.demos.tailgrids.com\",\"meta\":{\"title\":\"Synth AI - React AI Business Assistant Website Template\",\"description\":\"React AI website template for AI business assistant platforms. Includes features, integrations, pricing, blog, testimonials, and FAQs. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1774928320496-synth-ai-lg.png\"},\"availableVariants\":[\"react.js\"],\"sortOrder\":11,\"createdAt\":\"2026-03-31T03:40:21.475Z\",\"updatedAt\":\"2026-04-12T12:01:36.610Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"69db89a054ec191cf290f35f\",\"templateId\":\"69cb42255ca8dc5aaec15d2d\",\"filename\":\"synth-ai-main.zip\",\"fileKey\":\"1774928395231-synth-ai-main.zip\",\"createdAt\":\"2026-04-12T12:01:36.699Z\",\"updatedAt\":\"2026-04-12T12:01:36.699Z\"}]},{\"_id\":\"69cb46fa5ca8dc5aaec15fc0\",\"name\":\"DashSpace - React Admin Dashboard Template\",\"slug\":\"dashspace\",\"description\":\"$8b\",\"shortDescription\":\" React admin dashboard template for SaaS apps and internal tools. Includes charts, tables, KPI cards, and analytics dashboard. Built with Tailwind CSS.\",\"builtWith\":[\"React, Tailwind CSS\"],\"pagesIncluded\":[\"Dashboard\",\"Calendar\",\"Table\",\"Chart\",\"Sign In\",\"Sign Up\"],\"tags\":[{\"_id\":\"696df49b5fa6635953bd1131\",\"name\":\"Dashboard \",\"slug\":\"dashboard \",\"ogTitle\":\"\",\"ogDescription\":\"\",\"ogImageLink\":\"\",\"createdAt\":\"2026-01-19T09:08:43.528Z\",\"updatedAt\":\"2026-01-19T09:08:43.528Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1774929579460-dashspace-lg.png\"],\"previewUrl\":\"https://dashspace.demos.tailgrids.com\",\"meta\":{\"title\":\"DashSpace - React Admin Dashboard Template\",\"description\":\" React admin dashboard template for SaaS apps and internal tools. Includes charts, tables, KPI cards, and analytics dashboard. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1774929603585-dashspace-lg.png\"},\"availableVariants\":[\"react.js\"],\"sortOrder\":12,\"createdAt\":\"2026-03-31T04:00:58.617Z\",\"updatedAt\":\"2026-03-31T04:00:58.617Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"69cb46fa5ca8dc5aaec15fc2\",\"templateId\":\"69cb46fa5ca8dc5aaec15fc0\",\"filename\":\"dash-space-main.zip\",\"fileKey\":\"1774929636202-dash-space-main.zip\",\"createdAt\":\"2026-03-31T04:00:58.650Z\",\"updatedAt\":\"2026-03-31T04:00:58.650Z\"}]},{\"_id\":\"69cb4b4c5ca8dc5aaec161ce\",\"name\":\"AI Chat - React AI Chat Interface Template\",\"slug\":\"ai-chat\",\"description\":\"$8c\",\"shortDescription\":\" React AI chat interface template for AI assistant apps. Includes chat input, sidebar, conversation history, and model selector. Built with Tailwind CSS.\",\"builtWith\":[\"React, Tailwind CSS\"],\"pagesIncluded\":[\"Chat\",\"Conversation\",\"Settings\"],\"tags\":[{\"_id\":\"69cb4b115ca8dc5aaec161af\",\"name\":\"Applications\",\"slug\":\"applications\",\"ogTitle\":\"\",\"ogDescription\":\"\",\"ogImageLink\":\"\",\"createdAt\":\"2026-03-31T04:18:25.023Z\",\"updatedAt\":\"2026-03-31T04:18:25.023Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1774931267207-ai-chat.png\"],\"previewUrl\":\"https://aichat.demos.tailgrids.com\",\"meta\":{\"title\":\"AI Chat - React AI Chat Interface Template\",\"description\":\"React AI chat interface template for AI assistant apps. Includes chat input, sidebar, conversation history, and model selector. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1774930744783-ai-chat.png\"},\"availableVariants\":[\"react.js\"],\"sortOrder\":13,\"createdAt\":\"2026-03-31T04:19:24.465Z\",\"updatedAt\":\"2026-03-31T04:27:56.602Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"69cb4d4c5ca8dc5aaec163d4\",\"templateId\":\"69cb4b4c5ca8dc5aaec161ce\",\"filename\":\"ai-chat-main.zip\",\"fileKey\":\"1774930753647-ai-chat-main.zip\",\"createdAt\":\"2026-03-31T04:27:56.691Z\",\"updatedAt\":\"2026-03-31T04:27:56.691Z\"}]},{\"_id\":\"69cb4ea15ca8dc5aaec165ab\",\"name\":\"CMS Dashboard - React Content Management Dashboard Template\",\"slug\":\"cms\",\"description\":\"$8d\",\"shortDe
3scription\":\"React dashboard template for content and subscription platforms. Includes revenue charts, payment tables, analytics, and admin pages. Built with Tailwind CSS.\",\"builtWith\":[\"React, Tailwind CSS, Rechart\"],\"pagesIncluded\":[\"Dashboard\",\"Analytics\",\"All Posts\",\"Create Post\",\"Drafts\",\"Schedule\",\"Members\",\"Revenue\"],\"tags\":[{\"_id\":\"69cb4b115ca8dc5aaec161af\",\"name\":\"Applications\",\"slug\":\"applications\",\"ogTitle\":\"\",\"ogDescription\":\"\",\"ogImageLink\":\"\",\"createdAt\":\"2026-03-31T04:18:25.023Z\",\"updatedAt\":\"2026-03-31T04:18:25.023Z\"},{\"_id\":\"696df49b5fa6635953bd1131\",\"name\":\"Dashboard \",\"slug\":\"dashboard \",\"ogTitle\":\"\",\"ogDescription\":\"\",\"ogImageLink\":\"\",\"createdAt\":\"2026-01-19T09:08:43.528Z\",\"updatedAt\":\"2026-01-19T09:08:43.528Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1774931492625-cms.png\"],\"previewUrl\":\"https://cms.demos.tailgrids.com\",\"meta\":{\"title\":\"CMS Dashboard - React Content Management Dashboard Template\",\"description\":\"React dashboard template for content and subscription platforms. Includes revenue charts, payment tables, analytics, and admin pages. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1774931540440-cms.png\"},\"availableVariants\":[\"react.js\"],\"sortOrder\":14,\"createdAt\":\"2026-03-31T04:33:37.167Z\",\"updatedAt\":\"2026-03-31T04:33:37.167Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"69cb4ea15ca8dc5aaec165ad\",\"templateId\":\"69cb4ea15ca8dc5aaec165ab\",\"filename\":\"cms-space-main.zip\",\"fileKey\":\"1774931536755-cms-space-main.zip\",\"createdAt\":\"2026-03-31T04:33:37.199Z\",\"updatedAt\":\"2026-03-31T04:33:37.199Z\"}]},{\"_id\":\"69d5e6ed54ec191cf28e9fa5\",\"name\":\" File Manager - React Cloud File Management Dashboard Template\",\"slug\":\"file-manager\",\"description\":\"$8e\",\"shortDescription\":\"React cloud file management dashboard template for SaaS and team tools. Includes file storage, sharing, activity tracking, and a multi-page dashboard. Built with Tailwind CSS.\",\"builtWith\":[\"React.js\",\"Tailwind CSS\"],\"pagesIncluded\":[\"Home\",\"Overview\",\"Recent Files\",\"Trash\",\"Favorite\",\"Settings\"],\"tags\":[{\"_id\":\"69cb4b115ca8dc5aaec161af\",\"name\":\"Applications\",\"slug\":\"applications\",\"ogTitle\":\"\",\"ogDescription\":\"\",\"ogImageLink\":\"\",\"createdAt\":\"2026-03-31T04:18:25.023Z\",\"updatedAt\":\"2026-03-31T04:18:25.023Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1775625905741-file-manager.png\"],\"previewUrl\":\"https://filemanager.demos.tailgrids.com\",\"meta\":{\"title\":\"File Manager - React Cloud File Management Dashboard Template\",\"description\":\"React cloud file management dashboard template for SaaS and team tools. Includes file storage, sharing, activity tracking, and a multi-page dashboard. Built with Tailwind CSS.\",\"imageUrl\":\"https://assets.tailgrids.com/1775625944583-file-manager.png\"},\"availableVariants\":[\"react.js\"],\"sortOrder\":15,\"createdAt\":\"2026-04-08T05:26:05.241Z\",\"updatedAt\":\"2026-04-08T05:26:05.241Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"69d5e6ed54ec191cf28e9fa7\",\"templateId\":\"69d5e6ed54ec191cf28e9fa5\",\"filename\":\"file-manager-main.zip\",\"fileKey\":\"1775625958347-file-manager-main.zip\",\"createdAt\":\"2026-04-08T05:26:05.278Z\",\"updatedAt\":\"2026-04-08T05:26:05.278Z\"}]},{\"_id\":\"69d5ed0b54ec191cf28ea3c5\",\"name\":\"Lytic - React SaaS Analytics Dashboard Template\",\"slug\":\"lytic\",\"description\":\"$8f\",\"shortDescription\":\"Lytic is a React SaaS analytics dashboard template to track revenue, MRR, traffic, campaigns, and users. Built with React, Tailwind CSS, and ApexCharts. \",\"builtWith\":[\"React\",\"Tailwind CSS\"],\"pagesIncluded\":[\"Overview\",\"Analytics\",\"Revenue\",\"Campaign\",\"Users\",\"Settings\"],\"tags\":[{\"_id\":\"696df49b5fa6635953bd1131\",\"name\":\"Dashboard \",\"slug\":\"dashboard \",\"ogTitle\":\"\",\"ogDescription\":\"\",\"ogImageLink\":\"\",\"createdAt\":\"2026-01-19T09:08:43.528Z\",\"updatedAt\":\"2026-01-19T09:08:43.528Z\"}],\"version\":\"1.0.0\",\"featuredImages\":[\"https://assets.tailgrids.com/1775627437754-lytics-pro.png\"],\"previewUrl\":\"https://lytic.demos.tailgrids.com\",\"meta\":{\"title\":\"Lytic - React SaaS Analytics Dashboard Template\",\"description\":\"Lytic is a React SaaS analytics dashboard template to track revenue, MRR, traffic, campaigns, and users. Built with React, Tailwind CSS, and ApexCharts. \",\"imageUrl\":\"https://assets.tailgrids.com/1775627459277-lytics-pro.png\"},\"availableVariants\":[\"react.js\"],\"sortOrder\":16,\"createdAt\":\"2026-04-08T05:52:11.923Z\",\"updatedAt\":\"2026-04-13T06:18:02.940Z\",\"__v\":0,\"codeFiles\":[{\"_id\":\"69dc8a9b54ec191cf2913ac2\",\"templateId\":\"69d5ed0b54ec191cf28ea3c5\",\"filename\":\"lytic-main.zip\",\"fileKey\":\"1776061074524-lytic-main.zip\",\"createdAt\":\"2026-04-13T06:18:03.014Z\",\"updatedAt\":\"2026-04-13T06:18:03.014Z\"}]}]}]}]]}],\"$L90\",\"$L91\"]}]}]}]\n"])</script>
3<script>self.__next_f.push([1,"90:[\"$\",\"div\",null,{\"className\":\"relative -right-px col-start-1 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n91:[\"$\",\"div\",null,{\"className\":\"relative -left-px col-start-3 row-span-full border-x border-x-(--pattern-fg) bg-[repeating-linear-gradient(315deg,var(--pattern-fg)_0,var(--pattern-fg)_1px,transparent_0,transparent_50%)] bg-size-[10px_10px] bg-fixed\"}]\n"])</script>
3</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.