this repo has no description
kitten.sh
1<!DOCTYPE html><html lang="en" class="__className_e8ce0c"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/e4af272ccee01ff0-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/_next/static/css/0400282a37e0b5cc.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/931b179cff3131dc.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-db645017da02a8f9.js"/><script src="/_next/static/chunks/4bd1b696-bdbcd6b6abfa5f41.js" async=""></script><script src="/_next/static/chunks/684-497e116eabb8fcaa.js" async=""></script><script src="/_next/static/chunks/main-app-b8b88b0914fccdba.js" async=""></script><script src="/_next/static/chunks/769-8af0dd6ba1917f5d.js" async=""></script><script src="/_next/static/chunks/493-66441aebc1d39abd.js" async=""></script><script src="/_next/static/chunks/857-9d435cd9637ba7a9.js" async=""></script><script src="/_next/static/chunks/993-3e8f4916e432e2f6.js" async=""></script><script src="/_next/static/chunks/711-fc912928148f438c.js" async=""></script><script src="/_next/static/chunks/341-5271f225a215cf0f.js" async=""></script><script src="/_next/static/chunks/76-f5e5a5aff019cbf9.js" async=""></script><script src="/_next/static/chunks/437-c0536b8cc623be5c.js" async=""></script><script src="/_next/static/chunks/305-d093f0536b9045a7.js" async=""></script><script src="/_next/static/chunks/818-d9e48921ed4733b8.js" async=""></script><script src="/_next/static/chunks/app/docs/layout-4ba82388b1281064.js" async=""></script><script src="/_next/static/chunks/app/layout-5abee9e51885f5fd.js" async=""></script><script src="/_next/static/chunks/637-c682ed75bce4e9f9.js" async=""></script><script src="/_next/static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js" async=""></script><meta name="next-size-adjust" content=""/><title>Troubleshooting</title><meta property="og:title" content="Troubleshooting"/><meta property="og:image:type" content="image/png"/><meta property="og:image:width" content="1280"/><meta property="og:image:height" content="720"/><meta property="og:image" content="https://www.nativewind.dev/opengraph-image.png?a84e8d7ff09b577f"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="Troubleshooting"/><meta name="twitter:image:type" content="image/png"/><meta name="twitter:image:width" content="1280"/><meta name="twitter:image:height" content="720"/><meta name="twitter:image" content="https://www.nativewind.dev/opengraph-image.png?a84e8d7ff09b577f"/><link rel="icon" href="/favicon.svg"/><script>document.querySelectorAll('body link[rel="icon"], body link[rel="apple-touch-icon"]').forEach(el => document.head.appendChild(el))</script><script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script></head><body class="flex flex-col min-h-screen"><script>((e,t,r,n,o,a,i,l)=>{let u=document.documentElement,s=["light","dark"];function c(t){var r;(Array.isArray(e)?e:[e]).forEach(e=>{let r="class"===e,n=r&&a?o.map(e=>a[e]||e):o;r?(u.classList.remove(...n),u.classList.add(a&&a[t]?a[t]:t)):u.setAttribute(e,t)}),r=t,l&&s.includes(r)&&(u.style.colorScheme=r)}if(n)c(n);else try{let e=localStorage.getItem(t)||r,n=i&&"system"===e?window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light":e;c(n)}catch(e){}})("class","theme","system",null,["light","dark"],null,true,true)</script><main id="nd-docs-layout" class="flex w-full flex-1 flex-row pe-(--fd-layout-offset) [--fd-nav-height:calc(var(--spacing)*14)] [--fd-tocnav-height:36px] md:[--fd-sidebar-width:286px] xl:[--fd-toc-width:286px] xl:[--fd-tocnav-height:0px]" style="--fd-layout-offset:max(calc(50vw - var(--fd-layout-width) / 2), 0px)"><aside data-open="false" id="nd-sidebar" data-collapsed="false" style="--fd-sidebar-offset:calc(var(--fd-sidebar-width) - 20px);--fd-sidebar-height:calc(100dvh - var(--fd-banner-height) - var(--fd-nav-height))" class="fixed top-[calc(var(--fd-banner-height)+var(--fd-nav-height))] z-10 text-sm md:sticky md:h-(--fd-sidebar-height) max-md:inset-x-0 max-md:bottom-0 max-md:bg-fd-background/80 max-md:text-[15px] max-md:backdrop-blur-lg max-md:data-[open=false]:invisible md:transition-all md:ps-(--fd-layout-offset) bg-transparent"><div class="flex size-full max-w-full flex-col !pt-0 md:ms-auto md:w-(--fd-sidebar-width) md:border-e md:!pt-0 md:pt-2.5"><div class="flex flex-col gap-2 px-4 empty:hidden"><div class="flex flex-col gap-4 pt-2 lg:hidden"><a class="text-sm flex flex-row items-center gap-2 rounded-md p-2 text-start [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 bg-fd-primary/10 text-fd-primary" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-open"><path d="M12 7v14"></path><path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"></path></svg>Docs</a></div></div><div dir="ltr" class="overflow-hidden h-full" style="position:relative;--radix-scroll-area-corner-width:0px;--radix-scroll-area-corner-height:0px"><style>[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}</style><div data-radix-scroll-area-viewport="" class="size-full rounded-[inherit] p-4 max-lg:pt-0" style="overflow-x:hidden;overflow-y:hidden"><div style="min-width:100%;display:table"><a href="https://github.com/nativewind/nativewind" rel="noreferrer noopener" target="_blank" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none lg:hidden" data-active="false" style="padding-inline-start:calc(var(--spacing) * 2)"><svg role="img" viewBox="0 0 24 24" fill="currentColor"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg>Github</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/blog"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-text"><path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20"></path><path d="M8 11h8"></path><path d="M8 7h6"></path></svg>Blog</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/#showcase"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-layout-template"><rect width="18" height="7" x="3" y="3" rx="1"></rect><rect width="9" height="7" x="3" y="14" rx="1"></rect><rect width="5" height="7" x="16" y="14" rx="1"></rect></svg>Showcase</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Overview</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs">Overview</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/guides/goals">Goals & Non-Goals</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Getting Started</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/getting-started/installation">Installation</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/getting-started/typescript">Typescript</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/getting-started/other-bundlers">Other bundlers</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/getting-started/using-with-monorepos">Using with Monorepos</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Guides</p><a data-active="true" class="flex flex-row items-center gap-2 rounded-md p-2 text-start [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 text-fd-primary sticky top-0 lg:-top-4 bg-fd-background/70 backdrop-blur z-10" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/guides/troubleshooting">Troubleshooting</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/guides/custom-components">How to write custom components</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/guides/third-party-components">Styling Third-Party Components</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/guides/themes">Themes</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/guides/editor-setup">Editor Setup</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Core concepts</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/core-concepts/tailwindcss">Built on Tailwind CSS</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/core-concepts/quirks">Quirks</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/core-concepts/responsive-design">Responsive Design</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/core-concepts/dark-mode">Dark Mode</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/core-concepts/functions-and-directives">Functions & Directives</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">React Native concepts</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/core-concepts/units">Units</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/core-concepts/differences">Platform Differences</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/core-concepts/style-specificity">Style Specificity</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/new-concepts/safe-area-insets">Safe Area Insets</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Customization</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/customization/configuration">Configuration</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/customization/content">Content</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/customization/theme">Theme</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/customization/colors">Colors</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">API</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/api/with-nativewind">withNativeWind</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/api/vars">vars()</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/api/use-color-scheme">useColorScheme()</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/api/remap-props">remapProps</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/api/css-interop">cssInterop</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Layout</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/aspect-ratio">Aspect Ratio</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/box-decoration-break">Box Decoration Break</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/box-sizing">Box Sizing</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/break-after">Break After</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/break-before">Break Before</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/break-inside">Break Inside</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/clear">Clear</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/columns">Columns</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/container">Container</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/display">Display</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/float">Floats</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/isolation">Isolation</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/object-fit">Object Fit</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/object-position">Object Position</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/overflow">Overflow</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/overscroll-behavior">Overscroll Behavior</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/position">Position</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/top-right-bottom-left">Top / Right / Bottom / Left</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/visibility">Visibility</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/layout/z-index">Z-Index</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Flexbox & Grid</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/align-content">Align Content</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/align-items">Align Items</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/align-self">Align Self</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/flex">Flex</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/flex-basis">Flex Basis</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/flex-direction">Flex Direction</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/flex-grow">Flex Grow</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/flex-shrink">Flex Shrink</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/flex-wrap">Flex Wrap</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/gap">Gap</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/grid-auto-columns">Grid Auto Columns</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/grid-auto-flow">Grid Auto Flow</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/grid-auto-rows">Grid Auto Rows</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/grid-column">Grid Column Start / End</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/grid-row">Grid Row Start / End</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/grid-template-columns">Grid Template Columns</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/grid-template-rows">Grid Template Rows</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/justify-content">Justify Content</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/justify-items">Justify Items</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/justify-self">Justify Self</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/order">Order</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/place-content">Place Items</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/place-items">Place Content</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/flexbox/place-self">Place Self</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Spacing</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/spacing/margin">Margin</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/spacing/padding">Padding</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/spacing/space-between">Space Between</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Sizing</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/sizing/height">Height</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/sizing/max-height">Max-Height</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/sizing/max-width">Max-Width</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/sizing/min-height">Min-Height</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/sizing/min-width">Min-Width</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/sizing/width">Width</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Typography</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/content">Content</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/font-family">Font Family</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/font-size">Font Size</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/font-smoothing">Font Smoothing</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/font-style">Font Style</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/font-variant-numeric">Font Variant Numeric</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/font-weight">Font Weight</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/hyphens">Hyphens</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/letter-spacing">Letter Spacing</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/line-clamp">Line Clamp</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/line-height">Line Height</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/list-style-image">List Style Image</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/list-style-position">List Style Position</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/list-style-type">List Style Type</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-align">Text Transform</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-color">Text Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-decoration">Text Decoration</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-decoration-color">Text Decoration Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-decoration-style">Text Decoration Style</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-decoration-thickness">Text Decoration Thickness</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-indent">Text Indent</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-overflow">Text Overflow</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-transform">Text Align</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/text-underline-offset">Text Underline Offset</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/vertical-align">Vertical Align</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/whitespace">Whitespace</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/typography/word-break">Word Break</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Backgrounds</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/backgrounds/background-attachment">Background Attachment</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/backgrounds/background-clip">Background Clip</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/backgrounds/background-color">Background Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/backgrounds/background-image">Background Image</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/backgrounds/background-origin">Background Origin</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/backgrounds/background-position">Background Position</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/backgrounds/background-repeat">Background Repeat</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/backgrounds/background-size">Background Size</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/backgrounds/gradient-color-stops">Gradient Color Stops</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Borders</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/border-color">Border Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/border-radius">Border Radius</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/border-style">Border Style</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/border-width">Border Width</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/divide-color">Divide Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/divide-style">Divide Style</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/divide-width">Divide Width</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/outline-color">Outline Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/outline-offset">Outline Offset</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/outline-style">Outline Style</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/outline-width">Outline Width</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/ring-color">Ring Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/ring-offset-color">Ring Offset Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/ring-offset-width">Ring Offset Width</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/borders/ring-width">Ring Width</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Effects</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/effects/background-blend-mode">Background Blend Mode</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/effects/box-shadow">Box Shadow</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/effects/box-shadow-color">Box Shadow Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/effects/mix-blend-mode">Mix Blend Mode</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/effects/opacity">Opacity</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Transitions & Animation</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transitions-animation/animation">Animation</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transitions-animation/transition-delay">Transition Delay</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transitions-animation/transition-duration">Transition Duration</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transitions-animation/transition-property">Transition Property</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transitions-animation/transition-timing-function">Transition Timing Function</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Transforms</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transforms/rotate">Rotate</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transforms/scale">Scale</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transforms/skew">Skew</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transforms/transform-origin">Transform Origin</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/transforms/translate">Translate</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Interactivity</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/accent-color">Accent Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/appearance">Appearance</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/caret-color">Caret Color</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/cursor">Cursor</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/pointer-events">Pointer Events</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/resize">Resize</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/scroll-behaviour">Scroll Behavior</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/scroll-margin">Scroll Margin</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/scroll-padding">Scroll Padding</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/scroll-snap-align">Scroll Snap Align</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/scroll-snap-stop">Scroll Snap Stop</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/scroll-snap-type">Scroll Snap Type</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/touch-action">Touch Action</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/user-select">User Select</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/interactivity/will-change">Will Change</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">SVG</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/svg/fill">Fill</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/svg/stroke">Stroke</a><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/svg/stroke-width">Stroke Width</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Accessibility</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/accessibility/screen-readers">Screen Readers</a><p class="inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium [&_svg]:size-4 [&_svg]:shrink-0 mt-8" style="padding-inline-start:calc(var(--spacing) * 2)">Plugins</p><a data-active="false" class="relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs/tailwind/plugins/container-queries">Container Queries</a></div></div></div><div class="border-t px-4 py-3 empty:hidden flex flex-row items-center md:hidden"><button class="inline-flex items-center rounded-full border border-fd-foreground/10 p-1 bg-white/20 dark:bg-black/20 backdrop-blur md:hidden" aria-label="Toggle Theme" data-theme-toggle=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sun size-6.5 rounded-full p-1.5 text-fd-muted-foreground"><circle cx="12" cy="12" r="4"></circle><path d="M12 2v2"></path><path d="M12 20v2"></path><path d="m4.93 4.93 1.41 1.41"></path><path d="m17.66 17.66 1.41 1.41"></path><path d="M2 12h2"></path><path d="M20 12h2"></path><path d="m6.34 17.66-1.41 1.41"></path><path d="m19.07 4.93-1.41 1.41"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-moon size-6.5 rounded-full p-1.5 text-fd-muted-foreground"><path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"></path></svg></button></div></div></aside><header id="nd-subnav" style="padding-inline-start:var(--fd-layout-offset)" class="fixed inset-x-0 top-(--fd-banner-height) z-10 pe-(--fd-layout-offset) backdrop-blur-lg transition-colors"><div class="flex flex-row border-b border-fd-foreground/10 px-4 h-14 lg:px-36"><div class="flex flex-row items-center flex-1 pe-4"><a class="lg:flex absolute left-4 hidden top-3 text-sm flex-row items-center gap-2 rounded-md p-2 text-start [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0 bg-fd-primary/10 text-fd-primary" style="padding-inline-start:calc(var(--spacing) * 2)" href="/docs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-open"><path d="M12 7v14"></path><path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"></path></svg>Docs</a><a class="inline-flex items-center gap-2.5 font-semibold group" href="/"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 590 110" class="h-6 group-hover:text-fd-primary duration-300"><path fill="currentColor" d="M38.39 68.281c10.696-.694 21.994.63 29.687 4.68 7.96 4.19 11.353 10.849 10.802 17.258-.52 6.042-4.607 11.513-10.6 13.181l-.285.077c-9.075 2.319-18.584-4.306-19.643-13.558l-.044-.442-.012-.189a3.68 3.68 0 0 1 7.323-.619l.021.189.023.23c.56 4.834 5.773 8.469 10.51 7.259l.262-.073c2.698-.817 4.835-3.454 5.113-6.686.264-3.067-1.188-7.11-6.898-10.116-5.978-3.147-15.71-4.501-25.782-3.847-10.072.653-19.546 3.254-25.067 7.147l-.158.105a3.68 3.68 0 0 1-4.083-6.118l.678-.464c7.116-4.718 17.793-7.341 28.154-8.014M102.13 25.779c9.811.34 18.446 8.182 18.288 18.438l-.014.498c-.238 5.563-2.353 10.429-6.203 14.005-3.814 3.544-9.059 5.573-15.172 6.054-3.35.263-7.81-.581-12.554-1.485-4.967-.947-10.816-2.096-17.598-2.811-13.29-1.403-30.147-1.134-49.963 5.86l-.947.338a3.68 3.68 0 0 1-2.504-6.919l1.005-.36c21.073-7.436 39.07-7.727 53.182-6.237 7.135.753 13.283 1.963 18.203 2.9 5.143.98 8.464 1.545 10.598 1.378 4.857-.382 8.406-1.939 10.742-4.108 2.3-2.137 3.696-5.115 3.859-8.93l.008-.282c.085-5.796-4.893-10.768-11.173-10.985l-.306-.007c-5.826-.057-10.31 3.572-11.466 9.283a3.68 3.68 0 0 1-7.213-1.46c1.857-9.17 9.398-15.274 18.753-15.181z"></path><path fill="currentColor" d="M53.784 21.904c.5-8.877 8.697-16.048 17.73-14.752l.331.052c6.939 1.156 11.565 7.015 12.222 13.385.698 6.76-2.975 13.804-11.616 17.543-14.547 6.294-18.427 5.793-45.693 12.193l-2.713.641-.186.04a3.68 3.68 0 0 1-1.701-7.15l.182-.049 2.797-.66c28.056-6.59 30.607-5.804 44.393-11.769 5.983-2.588 7.554-6.772 7.218-10.034-.356-3.44-2.758-6.245-5.967-6.856l-.313-.052c-4.56-.655-9.066 3.108-9.337 7.873l-.01.227-.01.19a3.68 3.68 0 0 1-7.346-.21v-.188z"></path><path fill="currentColor" fill-rule="evenodd" d="M233.686 40.379q3.455.07 6.473 1.21l.398.156q2.95 1.185 5.159 3.144l.42.37a17 17 0 0 1 1.543 1.598v-1.926c0-1.077.353-1.998 1.076-2.72.723-.78 1.674-1.16 2.804-1.16 1.083 0 2.001.386 2.718 1.16.774.717 1.162 1.636 1.162 2.72v37.263A3.84 3.84 0 0 1 254.278 85c-.717.774-1.636 1.16-2.719 1.16-1.066 0-1.974-.338-2.68-1.032l-.139-.144c-.708-.772-1.061-1.712-1.061-2.789v-2.03a19 19 0 0 1-2.295 2.404l-.008.008q-2.265 1.915-5.37 3.207l-.007.002q-3.055 1.22-6.607 1.219c-3.921 0-7.453-1.01-10.58-3.037l-.006-.004c-3.116-2.077-5.594-4.874-7.433-8.38l-.003-.006c-1.787-3.516-2.674-7.511-2.674-11.972 0-4.517.886-8.513 2.675-11.975l.002-.003.353-.649c1.8-3.199 4.163-5.726 7.09-7.569 3.124-2.023 6.597-3.035 10.407-3.035zm.466 7.248c-2.668 0-5.052.678-7.163 2.03l.001.001c-1.932 1.271-3.488 2.997-4.666 5.19l-.23.446c-1.2 2.399-1.807 5.165-1.807 8.31 0 3.088.578 5.857 1.724 8.316 1.203 2.406 2.839 4.309 4.903 5.722 2.108 1.404 4.516 2.109 7.238 2.109l.507-.008c2.514-.083 4.725-.786 6.647-2.101l.005-.003.391-.27q2.894-2.072 4.505-5.445l.002-.004.219-.465q1.587-3.51 1.589-7.85l-.007-.565q-.108-4.202-1.799-7.577l-.006-.012c-1.146-2.455-2.775-4.352-4.887-5.706l-.006-.004-.006-.004c-1.922-1.315-4.133-2.02-6.647-2.102zM380.116 40.374q3.983 0 7.704 1.472l.463.19a19.2 19.2 0 0 1 6.123 4.14l.355.353q2.617 2.675 4.233 6.395l.21.492c1.02 2.477 1.554 5.225 1.608 8.236v.01c0 .978-.351 1.824-1.035 2.513l-.141.136c-.767.702-1.676 1.061-2.704 1.061h-30.19q.292 3.705 1.819 6.62c1.309 2.397 3.103 4.3 5.388 5.717 2.278 1.356 4.949 2.042 8.027 2.042l.711-.012c1.63-.054 3.055-.297 4.28-.72l.526-.19q1.81-.686 3.157-1.61 1.566-1.156 2.621-2.293l.037-.04.045-.031c.789-.547 1.591-.85 2.396-.85l.18.004c.89.038 1.646.368 2.22 1.007a3.26 3.26 0 0 1 .973 2.362c0 1.128-.536 2.096-1.507 2.896-1.626 1.793-3.813 3.368-6.544 4.734l-.008.004q-4.16 1.992-8.834 1.992c-4.293 0-8.104-.856-11.419-2.581l-.657-.358c-3.456-1.958-6.17-4.64-8.131-8.043l-.004-.008c-1.905-3.464-2.85-7.436-2.85-11.903 0-4.965.971-9.222 2.936-12.749l.001-.003.384-.657c1.823-3.023 4.093-5.399 6.815-7.114l.591-.358c3.226-1.9 6.636-2.856 10.221-2.856m-.61 7.352a14 14 0 0 0-3.673.674l-.614.211-.009.003c-1.457.503-2.805 1.337-4.042 2.514l-.246.24c-1.237 1.237-2.273 2.861-3.098 4.892h.001a16 16 0 0 0-.662 2.282h25.551v-.145c-.219-2.212-.972-4.082-2.251-5.627l-.007-.007-.005-.007a12.4 12.4 0 0 0-4.633-3.74l-.005-.002a12.9 12.9 0 0 0-5.697-1.302zM578.417 22.63c1.083 0 2.002.387 2.719 1.16.774.717 1.161 1.636 1.161 2.72v55.684a3.84 3.84 0 0 1-1.16 2.805c-.717.774-1.637 1.16-2.72 1.16-1.066 0-1.973-.338-2.68-1.032l-.138-.144c-.709-.772-1.062-1.712-1.062-2.789v-2.2a18.5 18.5 0 0 1-1.815 1.969l-.48.436q-2.265 2.003-5.374 3.296l.001.001q-2.868 1.228-6.177 1.303l-.442.005c-3.867 0-7.397-1.011-10.578-3.035l-.003-.002c-3.119-2.022-5.598-4.793-7.438-8.3l-.002-.006c-1.675-3.296-2.56-7.013-2.664-11.14l-.01-.832c0-4.516.886-8.54 2.674-12.056l.002-.006.353-.649c1.8-3.199 4.163-5.726 7.09-7.569 3.124-2.023 6.597-3.035 10.407-3.035l.452.005q3.384.07 6.4 1.21l.397.156q2.952 1.185 5.159 3.144l.428.377a18 18 0 0 1 1.62 1.672V26.51c0-1.077.354-1.997 1.076-2.72.723-.78 1.674-1.16 2.804-1.16m-17.406 24.997c-2.667 0-5.048.706-7.159 2.113l-.003.002c-1.932 1.271-3.489 2.998-4.667 5.192l-.231.445c-1.199 2.399-1.805 5.165-1.805 8.31l.006.565q.108 4.206 1.799 7.662l.231.445c1.179 2.199 2.738 3.956 4.674 5.28 2.11 1.406 4.49 2.11 7.155 2.11l.508-.008c2.517-.08 4.73-.757 6.653-2.022 2.117-1.413 3.748-3.314 4.893-5.713l.002-.004.219-.465c1.057-2.341 1.589-4.955 1.589-7.85 0-3.145-.606-5.911-1.806-8.31l-.004-.008c-1.145-2.4-2.774-4.27-4.888-5.626l-.007-.004-.006-.004c-1.922-1.315-4.133-2.02-6.646-2.102z" clip-rule="evenodd"></path><path fill="currentColor" d="M350.21 40.713c.96.004 1.806.33 2.514.974l.131.126c.638.64.962 1.434.962 2.357l-.012.295a3.8 3.8 0 0 1-.172.842q-.093.451-.28.835l.001.002-16.309 37.517-.001.002c-.336.764-.786 1.376-1.363 1.806-.582.432-1.266.658-2.032.69l-.001-.002c-.818.06-1.607-.099-2.356-.473l-.023-.012-.022-.014c-.717-.456-1.226-1.134-1.541-1.996L313.397 46.23q-.174-.35-.343-.775l-.018-.042-.009-.046a5 5 0 0 1-.088-.807l-.005-.304c0-.874.34-1.667.974-2.364l.002-.002.14-.145c.715-.698 1.653-1.031 2.763-1.031l.291.01c.672.05 1.315.273 1.921.659a3.48 3.48 0 0 1 1.543 1.747l13.036 30.622 13-30.538c.336-.82.802-1.469 1.419-1.903.624-.438 1.363-.629 2.187-.597M198.992 26.014c.98.041 1.807.39 2.435 1.072l.121.128c.587.65.87 1.47.87 2.422V82.11l-.005.22c-.044 1.09-.423 2.02-1.155 2.753l-.008.008-.008.007a3.97 3.97 0 0 1-2.588 1.057l-.2.004a5.3 5.3 0 0 1-1.68-.28l-.022-.007-.023-.01c-.558-.248-1.021-.571-1.363-.981l-.008-.01-.006-.009-33.579-44.405v42.075c0 .965-.315 1.807-.945 2.5l-.13.136c-.675.676-1.574.991-2.636.991-1.014 0-1.88-.322-2.549-.991l-.009-.009-.008-.009c-.653-.719-.975-1.602-.975-2.618V29.89c0-1.124.348-2.076 1.076-2.804l.007-.008.008-.007c.767-.702 1.676-1.061 2.704-1.061.577 0 1.146.127 1.705.372.627.195 1.139.527 1.491 1.02l33.653 44.497V29.636c0-1.015.322-1.88.991-2.55l.137-.13c.692-.63 1.534-.946 2.499-.946zM274.852 30.24c.995.045 1.845.43 2.517 1.155l.131.137c.634.7.944 1.573.944 2.582v7.613h7.19c1.022 0 1.887.355 2.551 1.076l.128.135c.625.682.948 1.493.948 2.414 0 .966-.317 1.808-.947 2.5l-.129.136c-.67.67-1.537.992-2.551.992h-7.19v25.948c0 1.32.196 2.227.524 2.79l.136.216c.319.474.701.801 1.139 1.005a5.6 5.6 0 0 0 1.758.305l.366-.014q.434-.037.751-.15l.122-.05a3.9 3.9 0 0 1 1.718-.378c.746 0 1.378.379 1.891 1.01.606.614.89 1.42.89 2.363 0 1.249-.742 2.26-2.011 3.045l-.007.005-.008.005c-1.185.677-2.499 1.033-3.931 1.075l-.288.004q-1.216 0-3.006-.17l-.002-.002q-1.578-.16-3.129-.926l-.442-.231c-1.227-.675-2.246-1.767-3.068-3.236l-.006-.01-.005-.01c-.782-1.564-1.151-3.68-1.151-6.308V48.979h-4.909a3.48 3.48 0 0 1-2.415-.947l-.134-.129a3.58 3.58 0 0 1-1.073-2.443l-.004-.191c0-.985.369-1.824 1.094-2.483.706-.698 1.557-1.06 2.532-1.06h4.909v-7.612c0-1.09.391-2.015 1.175-2.734a3.84 3.84 0 0 1 2.789-1.146zM514.79 40.374c3.893 0 7.023.8 9.334 2.46l.42.314c2.063 1.604 3.534 3.698 4.409 6.269q1.465 4.063 1.463 9.033v23.744A3.84 3.84 0 0 1 529.255 85c-.672.725-1.521 1.11-2.517 1.155l-.202.005a3.84 3.84 0 0 1-2.805-1.16l-.007-.008-.007-.008c-.709-.773-1.061-1.712-1.061-2.789V58.62c0-2.088-.33-3.939-.978-5.56l-.004-.01-.004-.009c-.584-1.646-1.587-2.938-3.017-3.892l-.008-.006-.009-.006c-1.35-.986-3.26-1.51-5.789-1.51q-3.429.003-6.268 1.546l-.01.005c-1.901.977-3.413 2.303-4.547 3.976l-.004.007c-1.122 1.603-1.684 3.417-1.684 5.46v23.574a3.84 3.84 0 0 1-1.16 2.805c-.672.725-1.522 1.11-2.518 1.155l-.202.005c-1.09 0-2.034-.39-2.804-1.16l-.007-.008-.007-.008c-.708-.772-1.062-1.712-1.062-2.789V45.353c0-1.077.354-1.997 1.076-2.72l.147-.139a3.82 3.82 0 0 1 2.657-1.021l.211.005c1.038.044 1.915.425 2.593 1.156l.131.138c.634.7.945 1.571.945 2.58v2.27a18 18 0 0 1 3.249-3.255l.594-.444a19 19 0 0 1 4.612-2.42 16.3 16.3 0 0 1 6.001-1.129M301.287 40.796c1.083 0 2.002.387 2.719 1.16.774.717 1.161 1.636 1.161 2.72v37.517a3.84 3.84 0 0 1-1.16 2.805c-.717.774-1.637 1.16-2.72 1.16-1.066 0-1.973-.338-2.68-1.032l-.138-.144c-.708-.772-1.062-1.712-1.062-2.789V44.676c0-1.077.354-1.997 1.076-2.72l.147-.14c.742-.677 1.635-1.02 2.657-1.02M477.553 40.796c1.083 0 2.002.387 2.718 1.16.775.717 1.162 1.636 1.162 2.72v37.517c0 1.09-.39 2.035-1.161 2.805-.716.774-1.636 1.16-2.719 1.16-1.066 0-1.973-.338-2.68-1.032l-.139-.144c-.708-.772-1.061-1.712-1.061-2.789V44.676c0-1.077.353-1.997 1.076-2.72l.147-.14c.742-.677 1.635-1.02 2.657-1.02M458.662 43.26a3.576 3.576 0 0 1 6.723 2.435l-13.544 37.368c-1.495 4.123-7.334 3.962-8.651-.14l-.059-.198-6.882-24.85-6.882 24.85c-1.171 4.227-7.005 4.519-8.636.53l-.074-.192-13.544-37.368-.057-.173a3.576 3.576 0 0 1 6.713-2.434l.067.172 10.793 29.781 8.142-29.4a3.58 3.58 0 0 1 2.52-2.608h.003q.011-.004.022-.006a4 4 0 0 1 .324-.072l.052-.008.126-.018.041-.004.139-.014.041-.002.127-.006h.165l.127.006.041.002q.07.006.139.014l.041.004.126.018.052.008a3 3 0 0 1 .324.072l.023.005.002.001q.079.023.156.048a3.57 3.57 0 0 1 2.364 2.56l8.142 29.4zM301.287 26.981a4.599 4.599 0 1 1 0 9.198 4.599 4.599 0 0 1 0-9.198M477.553 26.981a4.599 4.599 0 1 1-.001 9.198 4.599 4.599 0 0 1 .001-9.198"></path></svg></a><button type="button" aria-haspopup="dialog" aria-expanded="false" aria-controls="radix-«Rhdejb»" data-state="closed" class="flex flex-row items-center cursor-pointer gap-2.5 ps-2 pe-4 py-1.5 hover:text-fd-accent-foreground"><svg class="opacity-20 -mr-2" height="24" viewBox="0 0 32 32" width="24"><path d="M22 5L9 28" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path></svg><div class="flex-1 text-start"><p class="text-sm font-medium">v4</p></div><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevrons-up-down size-4 text-fd-muted-foreground"><path d="m7 15 5 5 5-5"></path><path d="m7 9 5-5 5 5"></path></svg></button></div><button type="button" data-search-full="" class="inline-flex items-center gap-2 bg-white/30 dark:bg-black/30 hover:bg-white/30 dark:hover:bg-black/30 border border-dashed border-fd-foreground/10 hover:border-fd-foreground/20 cursor-pointer p-1.5 text-sm text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground w-full my-auto rounded-xl max-md:hidden max-w-sm px-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search ms-1 size-4"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg>Search<!-- --> <div class="ms-auto inline-flex gap-0.5"><kbd class="rounded-md border bg-fd-background px-1.5">⌘</kbd><kbd class="rounded-md border bg-fd-background px-1.5">K</kbd></div></button><div class="flex flex-1 flex-row items-center justify-end"><div class="flex flex-row items-center gap-6 px-4 empty:hidden max-lg:hidden"></div><button type="button" class="inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors duration-100 disabled:pointer-events-none disabled:opacity-50 hover:bg-fd-accent hover:text-fd-accent-foreground p-1.5 [&_svg]:size-5 md:hidden" data-search="" aria-label="Open Search"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.3-4.3"></path></svg></button><div class="inline-flex items-center rounded-full border border-fd-foreground/10 p-1 bg-white/20 dark:bg-black/20 backdrop-blur mr-2 max-md:hidden" data-theme-toggle=""><button aria-label="light" class="size-6.5 rounded-full p-1.5 text-fd-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sun size-full"><circle cx="12" cy="12" r="4"></circle><path d="M12 2v2"></path><path d="M12 20v2"></path><path d="m4.93 4.93 1.41 1.41"></path><path d="m17.66 17.66 1.41 1.41"></path><path d="M2 12h2"></path><path d="M20 12h2"></path><path d="m6.34 17.66-1.41 1.41"></path><path d="m19.07 4.93-1.41 1.41"></path></svg></button><button aria-label="dark" class="size-6.5 rounded-full p-1.5 text-fd-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-moon size-full"><path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"></path></svg></button><button aria-label="system" class="size-6.5 rounded-full p-1.5 text-fd-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-airplay size-full"><path d="M5 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-1"></path><path d="m12 15 5 6H7Z"></path></svg></button></div><button aria-label="Toggle Sidebar" data-open="false" class="inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors duration-100 disabled:pointer-events-none disabled:opacity-50 hover:bg-fd-accent hover:text-fd-accent-foreground p-1.5 [&_svg]:size-5 md:hidden"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-menu"><line x1="4" x2="20" y1="12" y2="12"></line><line x1="4" x2="20" y1="6" y2="6"></line><line x1="4" x2="20" y1="18" y2="18"></line></svg></button><a href="https://github.com/nativewind/nativewind" rel="noreferrer noopener" target="_blank" class="inline-flex items-center justify-center text-sm font-medium transition-colors duration-100 disabled:pointer-events-none disabled:opacity-50 hover:bg-fd-accent hover:text-fd-accent-foreground p-1.5 [&_svg]:size-4.5 text-fd-muted-foreground max-lg:hidden rounded-full border" aria-label="GitHub" data-active="false"><svg role="img" viewBox="0 0 24 24" fill="currentColor"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></a></div></div></header><div class="absolute top-0 xl:right-1/2 right-0 translate-x-1/2 -z-10 -translate-y-1/2 w-[64rem] h-[64rem] rounded-full bg-fd-primary/10 max-md:hidden [--mask:radial-gradient(circle_at_center,red,transparent_69%)] [mask-image:var(--mask)] [webkit-mask-image:var(--mask)] pointer-events-none"></div><div class="fixed top-0 xl:right-1/2 right-0 translate-x-1/2 -z-10 -translate-y-1/2 w-[64rem] h-[64rem] rounded-full bg-fd-primary/5 max-md:hidden [--mask:radial-gradient(circle_at_center,red,transparent_69%)] [mask-image:var(--mask)] [webkit-mask-image:var(--mask)] pointer-events-none"></div><div class="absolute top-0 xl:right-1/2 right-0 translate-x-1/2 -z-10 h-[64rem] w-[64rem] bg-grid-lines-xl dark:opacity-80 -translate-y-1/2 max-md:hidden [--mask:radial-gradient(circle_at_center_top,red,transparent)] [mask-image:var(--mask)] [webkit-mask-image:var(--mask)] -skew-20 pointer-events-none"></div><div id="nd-page" class="flex w-full min-w-0 flex-col mt-(--fd-nav-height)"><div class="sticky overflow-visible z-10 xl:hidden h-10" style="top:calc(var(--fd-banner-height) + var(--fd-nav-height))"><header id="nd-tocnav" class="border-b border-fd-foreground/10 backdrop-blur-sm transition-colors" data-state="closed"><button type="button" aria-controls="radix-«R57n7ejb»" aria-expanded="false" data-state="closed" class="flex flex-row items-center text-sm text-fd-muted-foreground gap-2.5 px-4 py-2.5 text-start focus-visible:outline-none [&_svg]:shrink-0 [&_svg]:size-4 md:px-6 w-full"><svg role="progressbar" viewBox="0 0 24 24" aria-valuenow="0" aria-valuemin="0" aria-valuemax="1" class=""><circle cx="12" cy="12" r="11" fill="none" stroke-width="2" class="stroke-current/25"></circle><circle cx="12" cy="12" r="11" fill="none" stroke-width="2" stroke="currentColor" stroke-dasharray="69.11503837897544" stroke-dashoffset="69.11503837897544" stroke-linecap="round" transform="rotate(-90 12 12)" class="transition-all"></circle></svg><span class="grid flex-1 *:row-start-1 *:col-start-1"><span class="truncate transition-all">Troubleshooting</span><span class="truncate transition-all opacity-0 translate-y-full pointer-events-none"></span></span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down transition-transform"><path d="m6 9 6 6 6-6"></path></svg></button><div data-state="closed" id="radix-«R57n7ejb»" hidden="" data-toc-popover="" class="overflow-hidden flex flex-col max-h-[50vh]"></div></header></div><article class="flex w-full flex-1 flex-col gap-6 px-4 md:px-6 pt-8 md:pt-12 xl:px-12 xl:mx-auto max-w-[860px]"><h1 class="text-3xl font-semibold">Troubleshooting</h1><p class="text-sm text-muted-foreground mb-4 italic">Last updated on <!-- -->May 30th, 2025</p><div class="prose">
2<div class="my-6 flex flex-row gap-2 rounded-lg border border-s-2 bg-fd-card p-3 text-sm text-fd-card-foreground shadow-md border-s-emerald-500 dark:border-s-emerald-300"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lightbulb size-5 stroke-emerald-500 dark:stroke-emerald-300"><path d="M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5"></path><path d="M9 18h6"></path><path d="M10 22h4"></path></svg><div class="min-w-0 flex-1"><div class="text-fd-muted-foreground prose-no-margin"><p>While troubleshooting, always start your application without the cache!</p><ul>
3<li>Expo <code>npx expo start --clear</code></li>
4<li>React Native CLI <code>npx react-native start --reset-cache</code></li>
5</ul></div></div></div>
6<p>Before troubleshooting Nativewind, it's crucial to ensure that Tailwind CSS itself is functioning correctly. Nativewind uses the Tailwind CLI to compile your styles, so any issues with Tailwind CLI should be resolved first. Using the command <code>npx tailwindcss --input <input.css> --output output.css</code>, Tailwind CLI will generate an <code>output.css</code> file. If you are troubleshooting a class that is not working, ensure that the css rule is present in the <code>output.css</code> file.</p>
7<h2 class="flex scroll-m-28 flex-row items-center gap-2" id="verifying-nativewind-installation"><a data-card="" href="#verifying-nativewind-installation" class="peer">Verifying Nativewind Installation</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h2>
8<p>Nativewind provides a utility function <code>verifyInstallation()</code> designed to help confirm that the package has been correctly installed.</p>
9<p>Import the <code>verifyInstallation</code> function from the Nativewind package and run within the scope of a React component. <strong>Do not invoke this function on the global scope</strong>, it should be run within a component.</p>
10<figure class="not-prose group fd-codeblock relative my-6 overflow-hidden rounded-lg border bg-fd-secondary/50 text-sm shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e" tabindex="0"><button type="button" class="inline-flex items-center justify-center rounded-md p-2 text-sm font-medium duration-100 disabled:pointer-events-none disabled:opacity-50 hover:bg-fd-accent hover:text-fd-accent-foreground transition-opacity group-hover:opacity-100 [&_svg]:size-3.5 [@media(hover:hover)]:opacity-0 absolute right-2 top-2 z-[2] backdrop-blur-md" aria-label="Copy Text"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check transition-transform scale-0"><path d="M20 6 9 17l-5-5"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy absolute transition-transform"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button><div dir="ltr" class="overflow-hidden" style="position:relative;--radix-scroll-area-corner-width:0px;--radix-scroll-area-corner-height:0px"><style>[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}</style><div data-radix-scroll-area-viewport="" class="size-full rounded-[inherit] max-h-[600px]" style="overflow-x:hidden;overflow-y:hidden"><div style="min-width:100%;display:table"><pre class="p-4 focus-visible:outline-none"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> React </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'react'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
11<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { verifyInstallation } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'nativewind'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
12<span class="line"> </span>
13<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> App</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() {</span></span>
14<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D"> // Ensure to call inside a component, not globally</span></span>
15<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> verifyInstallation</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
16<span class="line"> </span>
17<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span></span>
18<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D"> // Your component JSX here...</span></span>
19<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> );</span></span>
20<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
21<span class="line"> </span>
22<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> App;</span></span></code></pre></div></div></div></figure>
23<h2 class="flex scroll-m-28 flex-row items-center gap-2" id="enabling-debug-mode"><a data-card="" href="#enabling-debug-mode" class="peer">Enabling debug mode</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h2>
24<p>Nativewind supports the <code>DEBUG</code> environment variable and will output various debug information while your server is running.</p>
25<div dir="ltr" data-orientation="horizontal" class="flex flex-col overflow-hidden rounded-xl border bg-fd-card my-4"><div role="tablist" aria-orientation="horizontal" class="flex flex-row items-end gap-4 overflow-x-auto bg-fd-secondary px-4 text-fd-muted-foreground" tabindex="-1" data-orientation="horizontal" style="outline:none"><button type="button" role="tab" aria-selected="true" aria-controls="radix-«Rih97n7ejb»-content-osx" data-state="active" id="radix-«Rih97n7ejb»-trigger-osx" class="whitespace-nowrap border-b border-transparent py-2 text-sm font-medium transition-colors hover:text-fd-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-fd-primary data-[state=active]:text-fd-primary" tabindex="-1" data-orientation="horizontal" data-radix-collection-item="">osx</button><button type="button" role="tab" aria-selected="false" aria-controls="radix-«Rih97n7ejb»-content-windows" data-state="inactive" id="radix-«Rih97n7ejb»-trigger-windows" class="whitespace-nowrap border-b border-transparent py-2 text-sm font-medium transition-colors hover:text-fd-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-fd-primary data-[state=active]:text-fd-primary" tabindex="-1" data-orientation="horizontal" data-radix-collection-item="">windows</button></div><div data-state="active" data-orientation="horizontal" role="tabpanel" aria-labelledby="radix-«Rih97n7ejb»-trigger-osx" id="radix-«Rih97n7ejb»-content-osx" tabindex="0" class="p-4 prose-no-margin [&>figure:only-child]:-m-4 [&>figure:only-child]:rounded-none [&>figure:only-child]:border-none" label="Mac / Linux" style="animation-duration:0s"><figure class="not-prose group fd-codeblock relative my-6 overflow-hidden rounded-lg border bg-fd-secondary/50 text-sm shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e" tabindex="0"><button type="button" class="inline-flex items-center justify-center rounded-md p-2 text-sm font-medium duration-100 disabled:pointer-events-none disabled:opacity-50 hover:bg-fd-accent hover:text-fd-accent-foreground transition-opacity group-hover:opacity-100 [&_svg]:size-3.5 [@media(hover:hover)]:opacity-0 absolute right-2 top-2 z-[2] backdrop-blur-md" aria-label="Copy Text"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check transition-transform scale-0"><path d="M20 6 9 17l-5-5"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy absolute transition-transform"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button><div dir="ltr" class="overflow-hidden" style="position:relative;--radix-scroll-area-corner-width:0px;--radix-scroll-area-corner-height:0px"><style>[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}</style><div data-radix-scroll-area-viewport="" class="size-full rounded-[inherit] max-h-[600px]" style="overflow-x:hidden;overflow-y:hidden"><div style="min-width:100%;display:table"><pre class="p-4 focus-visible:outline-none"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">DEBUG</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">nativewind</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> <start-command></span></span></code></pre></div></div></div></figure></div><div data-state="inactive" data-orientation="horizontal" role="tabpanel" aria-labelledby="radix-«Rih97n7ejb»-trigger-windows" hidden="" id="radix-«Rih97n7ejb»-content-windows" tabindex="0" class="p-4 prose-no-margin [&>figure:only-child]:-m-4 [&>figure:only-child]:rounded-none [&>figure:only-child]:border-none" label="Windows"></div></div>
26<div class="my-6 flex flex-row gap-2 rounded-lg border border-s-2 bg-fd-card p-3 text-sm text-fd-card-foreground shadow-md border-s-orange-500 dark:border-s-orange-400"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-triangle-alert size-5 fill-orange-500 dark:fill-orange-400 text-fd-card"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"></path><path d="M12 9v4"></path><path d="M12 17h.01"></path></svg><div class="min-w-0 flex-1"><div class="text-fd-muted-foreground prose-no-margin"><p>@react-native-community/cli may create multiple terminal sessions. You will need to ensure all sessions have <code>DEBUG=nativewind</code> set.</p></div></div></div>
27<p>By itself, this information may or may not be useful to you, but it is extremely useful when reporting to the developers on GitHub. You can record the terminal output by redirecting the output to a file.</p>
28<div dir="ltr" data-orientation="horizontal" class="flex flex-col overflow-hidden rounded-xl border bg-fd-card my-4"><div role="tablist" aria-orientation="horizontal" class="flex flex-row items-end gap-4 overflow-x-auto bg-fd-secondary px-4 text-fd-muted-foreground" tabindex="-1" data-orientation="horizontal" style="outline:none"><button type="button" role="tab" aria-selected="true" aria-controls="radix-«Roh97n7ejb»-content-osx" data-state="active" id="radix-«Roh97n7ejb»-trigger-osx" class="whitespace-nowrap border-b border-transparent py-2 text-sm font-medium transition-colors hover:text-fd-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-fd-primary data-[state=active]:text-fd-primary" tabindex="-1" data-orientation="horizontal" data-radix-collection-item="">osx</button><button type="button" role="tab" aria-selected="false" aria-controls="radix-«Roh97n7ejb»-content-windows" data-state="inactive" id="radix-«Roh97n7ejb»-trigger-windows" class="whitespace-nowrap border-b border-transparent py-2 text-sm font-medium transition-colors hover:text-fd-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-fd-primary data-[state=active]:text-fd-primary" tabindex="-1" data-orientation="horizontal" data-radix-collection-item="">windows</button></div><div data-state="active" data-orientation="horizontal" role="tabpanel" aria-labelledby="radix-«Roh97n7ejb»-trigger-osx" id="radix-«Roh97n7ejb»-content-osx" tabindex="0" class="p-4 prose-no-margin [&>figure:only-child]:-m-4 [&>figure:only-child]:rounded-none [&>figure:only-child]:border-none" label="Mac / Linux" style="animation-duration:0s"><figure class="not-prose group fd-codeblock relative my-6 overflow-hidden rounded-lg border bg-fd-secondary/50 text-sm shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e" tabindex="0"><button type="button" class="inline-flex items-center justify-center rounded-md p-2 text-sm font-medium duration-100 disabled:pointer-events-none disabled:opacity-50 hover:bg-fd-accent hover:text-fd-accent-foreground transition-opacity group-hover:opacity-100 [&_svg]:size-3.5 [@media(hover:hover)]:opacity-0 absolute right-2 top-2 z-[2] backdrop-blur-md" aria-label="Copy Text"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check transition-transform scale-0"><path d="M20 6 9 17l-5-5"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy absolute transition-transform"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button><div dir="ltr" class="overflow-hidden" style="position:relative;--radix-scroll-area-corner-width:0px;--radix-scroll-area-corner-height:0px"><style>[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}</style><div data-radix-scroll-area-viewport="" class="size-full rounded-[inherit] max-h-[600px]" style="overflow-x:hidden;overflow-y:hidden"><div style="min-width:100%;display:table"><pre class="p-4 focus-visible:outline-none"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">DEBUG</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">nativewind</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> script</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> output.log</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> <</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">start-comman</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">d</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">></span></span></code></pre></div></div></div></figure></div><div data-state="inactive" data-orientation="horizontal" role="tabpanel" aria-labelledby="radix-«Roh97n7ejb»-trigger-windows" hidden="" id="radix-«Roh97n7ejb»-content-windows" tabindex="0" class="p-4 prose-no-margin [&>figure:only-child]:-m-4 [&>figure:only-child]:rounded-none [&>figure:only-child]:border-none" label="Windows"></div></div>
29<h2 class="flex scroll-m-28 flex-row items-center gap-2" id="common-issues"><a data-card="" href="#common-issues" class="peer">Common Issues</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h2>
30<h3 class="flex scroll-m-28 flex-row items-center gap-2" id="your-cache-is-loading-old-data"><a data-card="" href="#your-cache-is-loading-old-data" class="peer">Your cache is loading old data</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h3>
31<p>Always reset your cache before troubleshooting an issue.</p>
32<h3 class="flex scroll-m-28 flex-row items-center gap-2" id="colors-are-not-working"><a data-card="" href="#colors-are-not-working" class="peer">Colors are not working</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h3>
33<p>React Native styling is much more restrictive than the web. This code will work on the web, but not on React Native:</p>
34<figure class="not-prose group fd-codeblock relative my-6 overflow-hidden rounded-lg border bg-fd-secondary/50 text-sm shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e" tabindex="0"><button type="button" class="inline-flex items-center justify-center rounded-md p-2 text-sm font-medium duration-100 disabled:pointer-events-none disabled:opacity-50 hover:bg-fd-accent hover:text-fd-accent-foreground transition-opacity group-hover:opacity-100 [&_svg]:size-3.5 [@media(hover:hover)]:opacity-0 absolute right-2 top-2 z-[2] backdrop-blur-md" aria-label="Copy Text"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check transition-transform scale-0"><path d="M20 6 9 17l-5-5"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy absolute transition-transform"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button><div dir="ltr" class="overflow-hidden" style="position:relative;--radix-scroll-area-corner-width:0px;--radix-scroll-area-corner-height:0px"><style>[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}</style><div data-radix-scroll-area-viewport="" class="size-full rounded-[inherit] max-h-[600px]" style="overflow-x:hidden;overflow-y:hidden"><div style="min-width:100%;display:table"><pre class="p-4 focus-visible:outline-none"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> App</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() {</span></span>
35<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span></span>
36<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> <</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">View</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> className</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"text-red-500"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
37<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> <</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">Text</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Hello, World!</</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">Text</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
38<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> </</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">View</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
39<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> );</span></span>
40<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre></div></div></div></figure>
41<p>The reason is that <code><View /></code> does not accept a <code>color</code> style and will not cascade the style! Instead, you must move the color classes to the <code><Text /></code> element</p>
42<h3 class="flex scroll-m-28 flex-row items-center gap-2" id="modifiers-are-not-working"><a data-card="" href="#modifiers-are-not-working" class="peer">Modifiers are not working</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h3>
43<p>Ensure the component you are applying the style to supports both the style and the required props (e.g <code>hover:text-white</code> - does the component support <code>color</code> styles and have an <code>onHover</code> prop?)</p>
44<h3 class="flex scroll-m-28 flex-row items-center gap-2" id="explicit-styles"><a data-card="" href="#explicit-styles" class="peer">Explicit styles</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h3>
45<p>React Native has various issues when conditionally applying styles. To prevent these issues it's best to declare all styles.</p>
46<p>For example, instead of only applying a text color for dark mode, provide both a light and dark mode text color.</p>
47<h3 class="flex scroll-m-28 flex-row items-center gap-2" id="dp-vs-px"><a data-card="" href="#dp-vs-px" class="peer">dp vs px</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h3>
48<p>React Native's default unit is density-independent pixels (dp) while the web's default is pixels (px). These two units are different, however Nativewind treats them as if they are equivalent. Additionally, the Nativewind's compiler requires a unit for most numeric values forcing some styles to use a <code>px</code> unit.</p>
49<h3 class="flex scroll-m-28 flex-row items-center gap-2" id="flex"><a data-card="" href="#flex" class="peer">Flex</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h3>
50<p>React Native uses a different base flex definition to the web. This can be fixed by adding <code>flex-1</code> to your classes, which forces the platforms to align.</p>
51<h3 class="flex scroll-m-28 flex-row items-center gap-2" id="flex-direction"><a data-card="" href="#flex-direction" class="peer">Flex Direction</a><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100" aria-label="Link to section"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg></h3>
52<p>React Native uses a different default <code>flex-direction</code> to the web. This can be fixed by explicitly setting a <code>flex-direction</code></p></div><div role="none" class="flex-1"></div><div class="flex flex-row flex-wrap items-center justify-between gap-4 empty:hidden"></div><div class="@container grid gap-4 pb-6 grid-cols-2"><a class="flex flex-col gap-2 rounded-lg border p-4 text-sm transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground @max-lg:col-span-full" href="/docs/getting-started/using-with-monorepos"><div class="inline-flex items-center gap-1.5 font-medium"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-left -mx-1 size-4 shrink-0 rtl:rotate-180"><path d="m15 18-6-6 6-6"></path></svg><p>Using with Monorepos</p></div><p class="text-fd-muted-foreground truncate">Learn how to set up Nativewind in monorepo environments like NX</p></a><a class="flex flex-col gap-2 rounded-lg border p-4 text-sm transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground @max-lg:col-span-full text-end" href="/docs/guides/custom-components"><div class="inline-flex items-center gap-1.5 font-medium flex-row-reverse"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right -mx-1 size-4 shrink-0 rtl:rotate-180"><path d="m9 18 6-6-6-6"></path></svg><p>How to write custom components</p></div><p class="text-fd-muted-foreground truncate">Next Page</p></a></div></article></div><div id="nd-toc" class="sticky top-[calc(var(--fd-banner-height)+var(--fd-nav-height))] h-(--fd-toc-height) pb-2 pt-12 max-xl:hidden" style="--fd-toc-height:calc(100dvh - var(--fd-banner-height) - var(--fd-nav-height))"><div class="flex h-full w-(--fd-toc-width) max-w-full flex-col gap-3 pe-4"><h3 class="inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-text size-4"><path d="M15 18H3"></path><path d="M17 6H3"></path><path d="M21 12H3"></path></svg>On this page</h3><div dir="ltr" class="overflow-hidden flex flex-col ps-px" style="position:relative;--radix-scroll-area-corner-width:0px;--radix-scroll-area-corner-height:0px"><style>[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}</style><div data-radix-scroll-area-viewport="" class="size-full rounded-[inherit] min-h-0 text-sm" style="overflow-x:hidden;overflow-y:hidden"><div style="min-width:100%;display:table"><div class="flex flex-col"><a data-active="false" href="#verifying-nativewind-installation" style="padding-inline-start:14px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><div class="absolute inset-y-0 w-px bg-fd-foreground/10" style="inset-inline-start:0"></div>Verifying Nativewind Installation</a><a data-active="false" href="#enabling-debug-mode" style="padding-inline-start:14px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><div class="absolute inset-y-0 w-px bg-fd-foreground/10" style="inset-inline-start:0"></div>Enabling debug mode</a><a data-active="false" href="#common-issues" style="padding-inline-start:14px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><div class="absolute inset-y-0 w-px bg-fd-foreground/10 bottom-1.5" style="inset-inline-start:0"></div>Common Issues</a><a data-active="false" href="#your-cache-is-loading-old-data" style="padding-inline-start:26px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" class="absolute -top-1.5 start-0 size-4 rtl:-scale-x-100"><line x1="0" y1="0" x2="10" y2="12" class="stroke-fd-foreground/10" stroke-width="1"></line></svg><div class="absolute inset-y-0 w-px bg-fd-foreground/10 top-1.5" style="inset-inline-start:10px"></div>Your cache is loading old data</a><a data-active="false" href="#colors-are-not-working" style="padding-inline-start:26px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><div class="absolute inset-y-0 w-px bg-fd-foreground/10" style="inset-inline-start:10px"></div>Colors are not working</a><a data-active="false" href="#modifiers-are-not-working" style="padding-inline-start:26px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><div class="absolute inset-y-0 w-px bg-fd-foreground/10" style="inset-inline-start:10px"></div>Modifiers are not working</a><a data-active="false" href="#explicit-styles" style="padding-inline-start:26px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><div class="absolute inset-y-0 w-px bg-fd-foreground/10" style="inset-inline-start:10px"></div>Explicit styles</a><a data-active="false" href="#dp-vs-px" style="padding-inline-start:26px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><div class="absolute inset-y-0 w-px bg-fd-foreground/10" style="inset-inline-start:10px"></div>dp vs px</a><a data-active="false" href="#flex" style="padding-inline-start:26px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><div class="absolute inset-y-0 w-px bg-fd-foreground/10" style="inset-inline-start:10px"></div>Flex</a><a data-active="false" href="#flex-direction" style="padding-inline-start:26px" class="prose relative py-1.5 text-sm text-fd-muted-foreground transition-colors [overflow-wrap:anywhere] first:pt-0 last:pb-0 data-[active=true]:text-fd-primary"><div class="absolute inset-y-0 w-px bg-fd-foreground/10" style="inset-inline-start:10px"></div>Flex Direction</a></div></div></div></div></div></div><!--$--><!--/$--><!--$--><!--/$--></main><script src="/_next/static/chunks/webpack-db645017da02a8f9.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[4341,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"RootProvider\"]\n3:I[7555,[],\"\"]\n4:I[1295,[],\"\"]\n5:I[6874,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"\"]\n6:I[1828,[\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"177\",\"static/chunks/app/layout-5abee9e51885f5fd.js\"],\"Analytics\"]\n7:I[4341,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"TreeContextProvider\"]\n8:I[4341,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"s"])</script><script>self.__next_f.push([1,"tatic/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"NavProvider\"]\n9:I[449,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"CollapsibleSidebar\"]\na:I[449,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"SidebarHeader\"]\nb:I[449,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"SidebarViewport\"]\nc:I[449,[\"769\",\"static/chu"])</script><script>self.__next_f.push([1,"nks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"SidebarItem\"]\nd:I[449,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"SidebarPageTree\"]\ne:I[449,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"SidebarFooter\"]\nf:I[6840,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/81"])</script><script>self.__next_f.push([1,"8-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"ThemeToggle\"]\n10:I[5135,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"Navbar\"]\n11:I[5135,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"DynamicLabel\"]\n15:I[8753,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"RootToggle\"]\n16:I[6157,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9."])</script><script>self.__next_f.push([1,"js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"LargeSearchToggle\"]\n17:I[6157,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"SearchToggle\"]\n18:I[5135,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"NavbarSidebarTrigger\"]\n19:I[9582,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"BaseLinkItem\"]\n1a:I[4341,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"493\",\"static/chunks/493-66441aebc1d39abd.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432"])</script><script>self.__next_f.push([1,"e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"341\",\"static/chunks/341-5271f225a215cf0f.js\",\"76\",\"static/chunks/76-f5e5a5aff019cbf9.js\",\"437\",\"static/chunks/437-c0536b8cc623be5c.js\",\"305\",\"static/chunks/305-d093f0536b9045a7.js\",\"818\",\"static/chunks/818-d9e48921ed4733b8.js\",\"499\",\"static/chunks/app/docs/layout-4ba82388b1281064.js\"],\"StylesProvider\"]\n1c:I[9665,[],\"MetadataBoundary\"]\n1e:I[9665,[],\"OutletBoundary\"]\n21:I[4911,[],\"AsyncMetadataOutlet\"]\n23:I[9665,[],\"ViewportBoundary\"]\n25:I[6614,[],\"\"]\n:HL[\"/_next/static/media/e4af272ccee01ff0-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/css/0400282a37e0b5cc.css\",\"style\"]\n:HL[\"/_next/static/css/931b179cff3131dc.css\",\"style\"]\n12:T46d,M38.39 68.281c10.696-.694 21.994.63 29.687 4.68 7.96 4.19 11.353 10.849 10.802 17.258-.52 6.042-4.607 11.513-10.6 13.181l-.285.077c-9.075 2.319-18.584-4.306-19.643-13.558l-.044-.442-.012-.189a3.68 3.68 0 0 1 7.323-.619l.021.189.023.23c.56 4.834 5.773 8.469 10.51 7.259l.262-.073c2.698-.817 4.835-3.454 5.113-6.686.264-3.067-1.188-7.11-6.898-10.116-5.978-3.147-15.71-4.501-25.782-3.847-10.072.653-19.546 3.254-25.067 7.147l-.158.105a3.68 3.68 0 0 1-4.083-6.118l.678-.464c7.116-4.718 17.793-7.341 28.154-8.014M102.13 25.779c9.811.34 18.446 8.182 18.288 18.438l-.014.498c-.238 5.563-2.353 10.429-6.203 14.005-3.814 3.544-9.059 5.573-15.172 6.054-3.35.263-7.81-.581-12.554-1.485-4.967-.947-10.816-2.096-17.598-2.811-13.29-1.403-30.147-1.134-49.963 5.86l-.947.338a3.68 3.68 0 0 1-2.504-6.919l1.005-.36c21.073-7.436 39.07-7.727 53.182-6.237 7.135.753 13.283 1.963 18.203 2.9 5.143.98 8.464 1.545 10.598 1.378 4.857-.382 8.406-1.939 10.742-4.108 2.3-2.137 3.696-5.115 3.859-8.93l.008-.282c.085-5.796-4.893-10.768-11.173-10.985l-.306-.007c-5.826-.057-10.31 3.572-11.466 9.283a3.68 3.68 0 0 1-7.213-1.46c1.857-9.17 9.398-15.274 18.753-15.181z13:Te3f,"])</script><script>self.__next_f.push([1,"M233.686 40.379q3.455.07 6.473 1.21l.398.156q2.95 1.185 5.159 3.144l.42.37a17 17 0 0 1 1.543 1.598v-1.926c0-1.077.353-1.998 1.076-2.72.723-.78 1.674-1.16 2.804-1.16 1.083 0 2.001.386 2.718 1.16.774.717 1.162 1.636 1.162 2.72v37.263A3.84 3.84 0 0 1 254.278 85c-.717.774-1.636 1.16-2.719 1.16-1.066 0-1.974-.338-2.68-1.032l-.139-.144c-.708-.772-1.061-1.712-1.061-2.789v-2.03a19 19 0 0 1-2.295 2.404l-.008.008q-2.265 1.915-5.37 3.207l-.007.002q-3.055 1.22-6.607 1.219c-3.921 0-7.453-1.01-10.58-3.037l-.006-.004c-3.116-2.077-5.594-4.874-7.433-8.38l-.003-.006c-1.787-3.516-2.674-7.511-2.674-11.972 0-4.517.886-8.513 2.675-11.975l.002-.003.353-.649c1.8-3.199 4.163-5.726 7.09-7.569 3.124-2.023 6.597-3.035 10.407-3.035zm.466 7.248c-2.668 0-5.052.678-7.163 2.03l.001.001c-1.932 1.271-3.488 2.997-4.666 5.19l-.23.446c-1.2 2.399-1.807 5.165-1.807 8.31 0 3.088.578 5.857 1.724 8.316 1.203 2.406 2.839 4.309 4.903 5.722 2.108 1.404 4.516 2.109 7.238 2.109l.507-.008c2.514-.083 4.725-.786 6.647-2.101l.005-.003.391-.27q2.894-2.072 4.505-5.445l.002-.004.219-.465q1.587-3.51 1.589-7.85l-.007-.565q-.108-4.202-1.799-7.577l-.006-.012c-1.146-2.455-2.775-4.352-4.887-5.706l-.006-.004-.006-.004c-1.922-1.315-4.133-2.02-6.647-2.102zM380.116 40.374q3.983 0 7.704 1.472l.463.19a19.2 19.2 0 0 1 6.123 4.14l.355.353q2.617 2.675 4.233 6.395l.21.492c1.02 2.477 1.554 5.225 1.608 8.236v.01c0 .978-.351 1.824-1.035 2.513l-.141.136c-.767.702-1.676 1.061-2.704 1.061h-30.19q.292 3.705 1.819 6.62c1.309 2.397 3.103 4.3 5.388 5.717 2.278 1.356 4.949 2.042 8.027 2.042l.711-.012c1.63-.054 3.055-.297 4.28-.72l.526-.19q1.81-.686 3.157-1.61 1.566-1.156 2.621-2.293l.037-.04.045-.031c.789-.547 1.591-.85 2.396-.85l.18.004c.89.038 1.646.368 2.22 1.007a3.26 3.26 0 0 1 .973 2.362c0 1.128-.536 2.096-1.507 2.896-1.626 1.793-3.813 3.368-6.544 4.734l-.008.004q-4.16 1.992-8.834 1.992c-4.293 0-8.104-.856-11.419-2.581l-.657-.358c-3.456-1.958-6.17-4.64-8.131-8.043l-.004-.008c-1.905-3.464-2.85-7.436-2.85-11.903 0-4.965.971-9.222 2.936-12.749l.001-.003.384-.657c1.823-3.023 4.093-5.399 6.815-7.114l.591-.358c3.226-1.9 6.636-2.856 10.221-2.856m-.61 7.352a14 14 0 0 0-3.673.674l-.614.211-.009.003c-1.457.503-2.805 1.337-4.042 2.514l-.246.24c-1.237 1.237-2.273 2.861-3.098 4.892h.001a16 16 0 0 0-.662 2.282h25.551v-.145c-.219-2.212-.972-4.082-2.251-5.627l-.007-.007-.005-.007a12.4 12.4 0 0 0-4.633-3.74l-.005-.002a12.9 12.9 0 0 0-5.697-1.302zM578.417 22.63c1.083 0 2.002.387 2.719 1.16.774.717 1.161 1.636 1.161 2.72v55.684a3.84 3.84 0 0 1-1.16 2.805c-.717.774-1.637 1.16-2.72 1.16-1.066 0-1.973-.338-2.68-1.032l-.138-.144c-.709-.772-1.062-1.712-1.062-2.789v-2.2a18.5 18.5 0 0 1-1.815 1.969l-.48.436q-2.265 2.003-5.374 3.296l.001.001q-2.868 1.228-6.177 1.303l-.442.005c-3.867 0-7.397-1.011-10.578-3.035l-.003-.002c-3.119-2.022-5.598-4.793-7.438-8.3l-.002-.006c-1.675-3.296-2.56-7.013-2.664-11.14l-.01-.832c0-4.516.886-8.54 2.674-12.056l.002-.006.353-.649c1.8-3.199 4.163-5.726 7.09-7.569 3.124-2.023 6.597-3.035 10.407-3.035l.452.005q3.384.07 6.4 1.21l.397.156q2.952 1.185 5.159 3.144l.428.377a18 18 0 0 1 1.62 1.672V26.51c0-1.077.354-1.997 1.076-2.72.723-.78 1.674-1.16 2.804-1.16m-17.406 24.997c-2.667 0-5.048.706-7.159 2.113l-.003.002c-1.932 1.271-3.489 2.998-4.667 5.192l-.231.445c-1.199 2.399-1.805 5.165-1.805 8.31l.006.565q.108 4.206 1.799 7.662l.231.445c1.179 2.199 2.738 3.956 4.674 5.28 2.11 1.406 4.49 2.11 7.155 2.11l.508-.008c2.517-.08 4.73-.757 6.653-2.022 2.117-1.413 3.748-3.314 4.893-5.713l.002-.004.219-.465c1.057-2.341 1.589-4.955 1.589-7.85 0-3.145-.606-5.911-1.806-8.31l-.004-.008c-1.145-2.4-2.774-4.27-4.888-5.626l-.007-.004-.006-.004c-1.922-1.315-4.133-2.02-6.646-2.102z"])</script><script>self.__next_f.push([1,"14:T1144,"])</script><script>self.__next_f.push([1,"M350.21 40.713c.96.004 1.806.33 2.514.974l.131.126c.638.64.962 1.434.962 2.357l-.012.295a3.8 3.8 0 0 1-.172.842q-.093.451-.28.835l.001.002-16.309 37.517-.001.002c-.336.764-.786 1.376-1.363 1.806-.582.432-1.266.658-2.032.69l-.001-.002c-.818.06-1.607-.099-2.356-.473l-.023-.012-.022-.014c-.717-.456-1.226-1.134-1.541-1.996L313.397 46.23q-.174-.35-.343-.775l-.018-.042-.009-.046a5 5 0 0 1-.088-.807l-.005-.304c0-.874.34-1.667.974-2.364l.002-.002.14-.145c.715-.698 1.653-1.031 2.763-1.031l.291.01c.672.05 1.315.273 1.921.659a3.48 3.48 0 0 1 1.543 1.747l13.036 30.622 13-30.538c.336-.82.802-1.469 1.419-1.903.624-.438 1.363-.629 2.187-.597M198.992 26.014c.98.041 1.807.39 2.435 1.072l.121.128c.587.65.87 1.47.87 2.422V82.11l-.005.22c-.044 1.09-.423 2.02-1.155 2.753l-.008.008-.008.007a3.97 3.97 0 0 1-2.588 1.057l-.2.004a5.3 5.3 0 0 1-1.68-.28l-.022-.007-.023-.01c-.558-.248-1.021-.571-1.363-.981l-.008-.01-.006-.009-33.579-44.405v42.075c0 .965-.315 1.807-.945 2.5l-.13.136c-.675.676-1.574.991-2.636.991-1.014 0-1.88-.322-2.549-.991l-.009-.009-.008-.009c-.653-.719-.975-1.602-.975-2.618V29.89c0-1.124.348-2.076 1.076-2.804l.007-.008.008-.007c.767-.702 1.676-1.061 2.704-1.061.577 0 1.146.127 1.705.372.627.195 1.139.527 1.491 1.02l33.653 44.497V29.636c0-1.015.322-1.88.991-2.55l.137-.13c.692-.63 1.534-.946 2.499-.946zM274.852 30.24c.995.045 1.845.43 2.517 1.155l.131.137c.634.7.944 1.573.944 2.582v7.613h7.19c1.022 0 1.887.355 2.551 1.076l.128.135c.625.682.948 1.493.948 2.414 0 .966-.317 1.808-.947 2.5l-.129.136c-.67.67-1.537.992-2.551.992h-7.19v25.948c0 1.32.196 2.227.524 2.79l.136.216c.319.474.701.801 1.139 1.005a5.6 5.6 0 0 0 1.758.305l.366-.014q.434-.037.751-.15l.122-.05a3.9 3.9 0 0 1 1.718-.378c.746 0 1.378.379 1.891 1.01.606.614.89 1.42.89 2.363 0 1.249-.742 2.26-2.011 3.045l-.007.005-.008.005c-1.185.677-2.499 1.033-3.931 1.075l-.288.004q-1.216 0-3.006-.17l-.002-.002q-1.578-.16-3.129-.926l-.442-.231c-1.227-.675-2.246-1.767-3.068-3.236l-.006-.01-.005-.01c-.782-1.564-1.151-3.68-1.151-6.308V48.979h-4.909a3.48 3.48 0 0 1-2.415-.947l-.134-.129a3.58 3.58 0 0 1-1.073-2.443l-.004-.191c0-.985.369-1.824 1.094-2.483.706-.698 1.557-1.06 2.532-1.06h4.909v-7.612c0-1.09.391-2.015 1.175-2.734a3.84 3.84 0 0 1 2.789-1.146zM514.79 40.374c3.893 0 7.023.8 9.334 2.46l.42.314c2.063 1.604 3.534 3.698 4.409 6.269q1.465 4.063 1.463 9.033v23.744A3.84 3.84 0 0 1 529.255 85c-.672.725-1.521 1.11-2.517 1.155l-.202.005a3.84 3.84 0 0 1-2.805-1.16l-.007-.008-.007-.008c-.709-.773-1.061-1.712-1.061-2.789V58.62c0-2.088-.33-3.939-.978-5.56l-.004-.01-.004-.009c-.584-1.646-1.587-2.938-3.017-3.892l-.008-.006-.009-.006c-1.35-.986-3.26-1.51-5.789-1.51q-3.429.003-6.268 1.546l-.01.005c-1.901.977-3.413 2.303-4.547 3.976l-.004.007c-1.122 1.603-1.684 3.417-1.684 5.46v23.574a3.84 3.84 0 0 1-1.16 2.805c-.672.725-1.522 1.11-2.518 1.155l-.202.005c-1.09 0-2.034-.39-2.804-1.16l-.007-.008-.007-.008c-.708-.772-1.062-1.712-1.062-2.789V45.353c0-1.077.354-1.997 1.076-2.72l.147-.139a3.82 3.82 0 0 1 2.657-1.021l.211.005c1.038.044 1.915.425 2.593 1.156l.131.138c.634.7.945 1.571.945 2.58v2.27a18 18 0 0 1 3.249-3.255l.594-.444a19 19 0 0 1 4.612-2.42 16.3 16.3 0 0 1 6.001-1.129M301.287 40.796c1.083 0 2.002.387 2.719 1.16.774.717 1.161 1.636 1.161 2.72v37.517a3.84 3.84 0 0 1-1.16 2.805c-.717.774-1.637 1.16-2.72 1.16-1.066 0-1.973-.338-2.68-1.032l-.138-.144c-.708-.772-1.062-1.712-1.062-2.789V44.676c0-1.077.354-1.997 1.076-2.72l.147-.14c.742-.677 1.635-1.02 2.657-1.02M477.553 40.796c1.083 0 2.002.387 2.718 1.16.775.717 1.162 1.636 1.162 2.72v37.517c0 1.09-.39 2.035-1.161 2.805-.716.774-1.636 1.16-2.719 1.16-1.066 0-1.973-.338-2.68-1.032l-.139-.144c-.708-.772-1.061-1.712-1.061-2.789V44.676c0-1.077.353-1.997 1.076-2.72l.147-.14c.742-.677 1.635-1.02 2.657-1.02M458.662 43.26a3.576 3.576 0 0 1 6.723 2.435l-13.544 37.368c-1.495 4.123-7.334 3.962-8.651-.14l-.059-.198-6.882-24.85-6.882 24.85c-1.171 4.227-7.005 4.519-8.636.53l-.074-.192-13.544-37.368-.057-.173a3.576 3.576 0 0 1 6.713-2.434l.067.172 10.793 29.781 8.142-29.4a3.58 3.58 0 0 1 2.52-2.608h.003q.011-.004.022-.006a4 4 0 0 1 .324-.072l.052-.008.126-.018.041-.004.139-.014.041-.002.127-.006h.165l.127.006.041.002q.07.006.139.014l.041.004.126.018.052.008a3 3 0 0 1 .324.072l.023.005.002.001q.079.023.156.048a3.57 3.57 0 0 1 2.364 2.56l8.142 29.4zM301.287 26.981a4.599 4.599 0 1 1 0 9.198 4.599 4.599 0 0 1 0-9.198M477.553 26.981a4.599 4.599 0 1 1-.001 9.198 4.599 4.599 0 0 1 .001-9.198"])</script><script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"czOghRJ8ho0TIHFmBTj4p\",\"p\":\"\",\"c\":[\"\",\"docs\",\"guides\",\"troubleshooting\"],\"i\":false,\"f\":[[[\"\",{\"children\":[\"docs\",{\"children\":[[\"slug\",\"guides/troubleshooting\",\"oc\"],{\"children\":[\"__PAGE__\",{}]}]}]},\"$undefined\",\"$undefined\",true],[\"\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/0400282a37e0b5cc.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/931b179cff3131dc.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"__className_e8ce0c\",\"suppressHydrationWarning\":true,\"children\":[\"$\",\"body\",null,{\"className\":\"flex flex-col min-h-screen\",\"children\":[[\"$\",\"$L2\",null,{\"children\":[\"$\",\"$L3\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L4\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[\"$\",\"div\",null,{\"className\":\"border-y border-dashed m-auto text-center flex flex-col items-center gap-4 py-8 w-screen max-w-fd-container\",\"children\":[[\"$\",\"div\",null,{\"className\":\"fixed max-w-fd-container lg:w-[calc(100%-1rem)] box-content lg:border-x border-dashed top-0 left-1/2 -translate-x-1/2 h-screen pointer-events-none\"}],[\"$\",\"h1\",null,{\"className\":\"font-mono text-8xl font-bold opacity-50\",\"children\":\"404\"}],[\"$\",\"h2\",null,{\"className\":\"font-mono text-2xl font-bold\",\"children\":\"Not Found\"}],[\"$\",\"p\",null,{\"className\":\"font-mono opacity-50 text-sm\",\"children\":[\"Could not find\",[\"$\",\"br\",null,{}],\" requested resource\"]}],[\"$\",\"$L5\",null,{\"href\":\"/\",\"className\":\"w-fit mx-auto bg-fd-foreground text-fd-background font-mono px-4 py-2 border-y border-dashed hover:rounded-xl duration-300\",\"children\":\"Return Home\"}]]}],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}],[\"$\",\"$L6\",null,{}]]}]}]]}],{\"children\":[\"docs\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L7\",null,{\"tree\":{\"$id\":\"root\",\"name\":\"Overview\",\"children\":[{\"type\":\"page\",\"icon\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-book-text\",\"children\":[[\"$\",\"path\",\"k3hazp\",{\"d\":\"M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20\"}],[\"$\",\"path\",\"vwpz6n\",{\"d\":\"M8 11h8\"}],[\"$\",\"path\",\"1f0q6e\",{\"d\":\"M8 7h6\"}],\"$undefined\"]}],\"name\":\"Blog\",\"url\":\"/blog/\",\"external\":false},{\"type\":\"page\",\"icon\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-layout-template\",\"children\":[[\"$\",\"rect\",\"f1a2em\",{\"width\":\"18\",\"height\":\"7\",\"x\":\"3\",\"y\":\"3\",\"rx\":\"1\"}],[\"$\",\"rect\",\"jqznyg\",{\"width\":\"9\",\"height\":\"7\",\"x\":\"3\",\"y\":\"14\",\"rx\":\"1\"}],[\"$\",\"rect\",\"q5h2i8\",{\"width\":\"5\",\"height\":\"7\",\"x\":\"16\",\"y\":\"14\",\"rx\":\"1\"}],\"$undefined\"]}],\"name\":\"Showcase\",\"url\":\"/#showcase\",\"external\":false},{\"$id\":\"#2\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Overview\"},{\"$id\":\"index.mdx\",\"type\":\"page\",\"name\":\"Overview\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs\",\"$ref\":{\"file\":\"index.mdx\"}},{\"$id\":\"guides/goals.mdx\",\"type\":\"page\",\"name\":\"Goals \u0026 Non-Goals\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/guides/goals\",\"$ref\":{\"file\":\"guides/goals.mdx\"}},{\"$id\":\"#5\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Getting Started\"},{\"$id\":\"getting-started/installation/index.mdx\",\"type\":\"page\",\"name\":\"Installation\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/getting-started/installation\",\"$ref\":{\"file\":\"getting-started/installation/index.mdx\"}},{\"$id\":\"getting-started/typescript.mdx\",\"type\":\"page\",\"name\":\"Typescript\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/getting-started/typescript\",\"$ref\":{\"file\":\"getting-started/typescript.mdx\"}},{\"$id\":\"getting-started/other-bundlers.mdx\",\"type\":\"page\",\"name\":\"Other bundlers\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/getting-started/other-bundlers\",\"$ref\":{\"file\":\"getting-started/other-bundlers.mdx\"}},{\"$id\":\"getting-started/using-with-monorepos.mdx\",\"type\":\"page\",\"name\":\"Using with Monorepos\",\"description\":\"Learn how to set up Nativewind in monorepo environments like NX\",\"icon\":\"$undefined\",\"url\":\"/docs/getting-started/using-with-monorepos\",\"$ref\":{\"file\":\"getting-started/using-with-monorepos.mdx\"}},{\"$id\":\"#10\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Guides\"},{\"$id\":\"guides/troubleshooting.mdx\",\"type\":\"page\",\"name\":\"Troubleshooting\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/guides/troubleshooting\",\"$ref\":{\"file\":\"guides/troubleshooting.mdx\"}},{\"$id\":\"guides/custom-components.mdx\",\"type\":\"page\",\"name\":\"How to write custom components\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/guides/custom-components\",\"$ref\":{\"file\":\"guides/custom-components.mdx\"}},{\"$id\":\"guides/third-party-components.mdx\",\"type\":\"page\",\"name\":\"Styling Third-Party Components\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/guides/third-party-components\",\"$ref\":{\"file\":\"guides/third-party-components.mdx\"}},{\"$id\":\"guides/themes.mdx\",\"type\":\"page\",\"name\":\"Themes\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/guides/themes\",\"$ref\":{\"file\":\"guides/themes.mdx\"}},{\"$id\":\"guides/editor-setup.mdx\",\"type\":\"page\",\"name\":\"Editor Setup\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/guides/editor-setup\",\"$ref\":{\"file\":\"guides/editor-setup.mdx\"}},{\"$id\":\"#16\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Core concepts\"},{\"$id\":\"core-concepts/tailwindcss.mdx\",\"type\":\"page\",\"name\":\"Built on Tailwind CSS\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/core-concepts/tailwindcss\",\"$ref\":{\"file\":\"core-concepts/tailwindcss.mdx\"}},{\"$id\":\"core-concepts/quirks.mdx\",\"type\":\"page\",\"name\":\"Quirks\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/core-concepts/quirks\",\"$ref\":{\"file\":\"core-concepts/quirks.mdx\"}},{\"$id\":\"core-concepts/responsive-design.mdx\",\"type\":\"page\",\"name\":\"Responsive Design\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/core-concepts/responsive-design\",\"$ref\":{\"file\":\"core-concepts/responsive-design.mdx\"}},{\"$id\":\"core-concepts/dark-mode.mdx\",\"type\":\"page\",\"name\":\"Dark Mode\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/core-concepts/dark-mode\",\"$ref\":{\"file\":\"core-concepts/dark-mode.mdx\"}},{\"$id\":\"core-concepts/functions-and-directives.mdx\",\"type\":\"page\",\"name\":\"Functions \u0026 Directives\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/core-concepts/functions-and-directives\",\"$ref\":{\"file\":\"core-concepts/functions-and-directives.mdx\"}},{\"$id\":\"#22\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"React Native concepts\"},{\"$id\":\"core-concepts/units.mdx\",\"type\":\"page\",\"name\":\"Units\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/core-concepts/units\",\"$ref\":{\"file\":\"core-concepts/units.mdx\"}},{\"$id\":\"core-concepts/differences.md\",\"type\":\"page\",\"name\":\"Platform Differences\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/core-concepts/differences\",\"$ref\":{\"file\":\"core-concepts/differences.md\"}},{\"$id\":\"core-concepts/style-specificity.mdx\",\"type\":\"page\",\"name\":\"Style Specificity\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/core-concepts/style-specificity\",\"$ref\":{\"file\":\"core-concepts/style-specificity.mdx\"}},{\"$id\":\"tailwind/new-concepts/safe-area-insets.mdx\",\"type\":\"page\",\"name\":\"Safe Area Insets\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/new-concepts/safe-area-insets\",\"$ref\":{\"file\":\"tailwind/new-concepts/safe-area-insets.mdx\"}},{\"$id\":\"#27\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Customization\"},{\"$id\":\"customization/configuration.md\",\"type\":\"page\",\"name\":\"Configuration\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/customization/configuration\",\"$ref\":{\"file\":\"customization/configuration.md\"}},{\"$id\":\"customization/content.md\",\"type\":\"page\",\"name\":\"Content\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/customization/content\",\"$ref\":{\"file\":\"customization/content.md\"}},{\"$id\":\"customization/theme.md\",\"type\":\"page\",\"name\":\"Theme\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/customization/theme\",\"$ref\":{\"file\":\"customization/theme.md\"}},{\"$id\":\"customization/colors.md\",\"type\":\"page\",\"name\":\"Colors\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/customization/colors\",\"$ref\":{\"file\":\"customization/colors.md\"}},{\"$id\":\"#32\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"API\"},{\"$id\":\"api/with-nativewind.mdx\",\"type\":\"page\",\"name\":\"withNativeWind\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/api/with-nativewind\",\"$ref\":{\"file\":\"api/with-nativewind.mdx\"}},{\"$id\":\"api/vars.mdx\",\"type\":\"page\",\"name\":\"vars()\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/api/vars\",\"$ref\":{\"file\":\"api/vars.mdx\"}},{\"$id\":\"api/use-color-scheme.md\",\"type\":\"page\",\"name\":\"useColorScheme()\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/api/use-color-scheme\",\"$ref\":{\"file\":\"api/use-color-scheme.md\"}},{\"$id\":\"api/remap-props.mdx\",\"type\":\"page\",\"name\":\"remapProps\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/api/remap-props\",\"$ref\":{\"file\":\"api/remap-props.mdx\"}},{\"$id\":\"api/css-interop.mdx\",\"type\":\"page\",\"name\":\"cssInterop\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/api/css-interop\",\"$ref\":{\"file\":\"api/css-interop.mdx\"}},{\"$id\":\"#38\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Layout\"},{\"$id\":\"tailwind/layout/aspect-ratio.mdx\",\"type\":\"page\",\"name\":\"Aspect Ratio\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/aspect-ratio\",\"$ref\":{\"file\":\"tailwind/layout/aspect-ratio.mdx\"}},{\"$id\":\"tailwind/layout/box-decoration-break.mdx\",\"type\":\"page\",\"name\":\"Box Decoration Break\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/box-decoration-break\",\"$ref\":{\"file\":\"tailwind/layout/box-decoration-break.mdx\"}},{\"$id\":\"tailwind/layout/box-sizing.mdx\",\"type\":\"page\",\"name\":\"Box Sizing\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/box-sizing\",\"$ref\":{\"file\":\"tailwind/layout/box-sizing.mdx\"}},{\"$id\":\"tailwind/layout/break-after.mdx\",\"type\":\"page\",\"name\":\"Break After\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/break-after\",\"$ref\":{\"file\":\"tailwind/layout/break-after.mdx\"}},{\"$id\":\"tailwind/layout/break-before.mdx\",\"type\":\"page\",\"name\":\"Break Before\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/break-before\",\"$ref\":{\"file\":\"tailwind/layout/break-before.mdx\"}},{\"$id\":\"tailwind/layout/break-inside.mdx\",\"type\":\"page\",\"name\":\"Break Inside\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/break-inside\",\"$ref\":{\"file\":\"tailwind/layout/break-inside.mdx\"}},{\"$id\":\"tailwind/layout/clear.mdx\",\"type\":\"page\",\"name\":\"Clear\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/clear\",\"$ref\":{\"file\":\"tailwind/layout/clear.mdx\"}},{\"$id\":\"tailwind/layout/columns.mdx\",\"type\":\"page\",\"name\":\"Columns\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/columns\",\"$ref\":{\"file\":\"tailwind/layout/columns.mdx\"}},{\"$id\":\"tailwind/layout/container.mdx\",\"type\":\"page\",\"name\":\"Container\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/container\",\"$ref\":{\"file\":\"tailwind/layout/container.mdx\"}},{\"$id\":\"tailwind/layout/display.mdx\",\"type\":\"page\",\"name\":\"Display\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/display\",\"$ref\":{\"file\":\"tailwind/layout/display.mdx\"}},{\"$id\":\"tailwind/layout/float.mdx\",\"type\":\"page\",\"name\":\"Floats\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/float\",\"$ref\":{\"file\":\"tailwind/layout/float.mdx\"}},{\"$id\":\"tailwind/layout/isolation.mdx\",\"type\":\"page\",\"name\":\"Isolation\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/isolation\",\"$ref\":{\"file\":\"tailwind/layout/isolation.mdx\"}},{\"$id\":\"tailwind/layout/object-fit.mdx\",\"type\":\"page\",\"name\":\"Object Fit\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/object-fit\",\"$ref\":{\"file\":\"tailwind/layout/object-fit.mdx\"}},{\"$id\":\"tailwind/layout/object-position.mdx\",\"type\":\"page\",\"name\":\"Object Position\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/object-position\",\"$ref\":{\"file\":\"tailwind/layout/object-position.mdx\"}},{\"$id\":\"tailwind/layout/overflow.mdx\",\"type\":\"page\",\"name\":\"Overflow\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/overflow\",\"$ref\":{\"file\":\"tailwind/layout/overflow.mdx\"}},{\"$id\":\"tailwind/layout/overscroll-behavior.mdx\",\"type\":\"page\",\"name\":\"Overscroll Behavior\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/overscroll-behavior\",\"$ref\":{\"file\":\"tailwind/layout/overscroll-behavior.mdx\"}},{\"$id\":\"tailwind/layout/position.mdx\",\"type\":\"page\",\"name\":\"Position\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/position\",\"$ref\":{\"file\":\"tailwind/layout/position.mdx\"}},{\"$id\":\"tailwind/layout/top-right-bottom-left.mdx\",\"type\":\"page\",\"name\":\"Top / Right / Bottom / Left\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/top-right-bottom-left\",\"$ref\":{\"file\":\"tailwind/layout/top-right-bottom-left.mdx\"}},{\"$id\":\"tailwind/layout/visibility.mdx\",\"type\":\"page\",\"name\":\"Visibility\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/visibility\",\"$ref\":{\"file\":\"tailwind/layout/visibility.mdx\"}},{\"$id\":\"tailwind/layout/z-index.mdx\",\"type\":\"page\",\"name\":\"Z-Index\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/layout/z-index\",\"$ref\":{\"file\":\"tailwind/layout/z-index.mdx\"}},{\"$id\":\"#40\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Flexbox \u0026 Grid\"},{\"$id\":\"tailwind/flexbox/align-content.mdx\",\"type\":\"page\",\"name\":\"Align Content\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/align-content\",\"$ref\":{\"file\":\"tailwind/flexbox/align-content.mdx\"}},{\"$id\":\"tailwind/flexbox/align-items.mdx\",\"type\":\"page\",\"name\":\"Align Items\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/align-items\",\"$ref\":{\"file\":\"tailwind/flexbox/align-items.mdx\"}},{\"$id\":\"tailwind/flexbox/align-self.mdx\",\"type\":\"page\",\"name\":\"Align Self\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/align-self\",\"$ref\":{\"file\":\"tailwind/flexbox/align-self.mdx\"}},{\"$id\":\"tailwind/flexbox/flex.mdx\",\"type\":\"page\",\"name\":\"Flex\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/flex\",\"$ref\":{\"file\":\"tailwind/flexbox/flex.mdx\"}},{\"$id\":\"tailwind/flexbox/flex-basis.mdx\",\"type\":\"page\",\"name\":\"Flex Basis\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/flex-basis\",\"$ref\":{\"file\":\"tailwind/flexbox/flex-basis.mdx\"}},{\"$id\":\"tailwind/flexbox/flex-direction.mdx\",\"type\":\"page\",\"name\":\"Flex Direction\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/flex-direction\",\"$ref\":{\"file\":\"tailwind/flexbox/flex-direction.mdx\"}},{\"$id\":\"tailwind/flexbox/flex-grow.mdx\",\"type\":\"page\",\"name\":\"Flex Grow\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/flex-grow\",\"$ref\":{\"file\":\"tailwind/flexbox/flex-grow.mdx\"}},{\"$id\":\"tailwind/flexbox/flex-shrink.mdx\",\"type\":\"page\",\"name\":\"Flex Shrink\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/flex-shrink\",\"$ref\":{\"file\":\"tailwind/flexbox/flex-shrink.mdx\"}},{\"$id\":\"tailwind/flexbox/flex-wrap.mdx\",\"type\":\"page\",\"name\":\"Flex Wrap\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/flex-wrap\",\"$ref\":{\"file\":\"tailwind/flexbox/flex-wrap.mdx\"}},{\"$id\":\"tailwind/flexbox/gap.mdx\",\"type\":\"page\",\"name\":\"Gap\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/gap\",\"$ref\":{\"file\":\"tailwind/flexbox/gap.mdx\"}},{\"$id\":\"tailwind/flexbox/grid-auto-columns.mdx\",\"type\":\"page\",\"name\":\"Grid Auto Columns\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/grid-auto-columns\",\"$ref\":{\"file\":\"tailwind/flexbox/grid-auto-columns.mdx\"}},{\"$id\":\"tailwind/flexbox/grid-auto-flow.mdx\",\"type\":\"page\",\"name\":\"Grid Auto Flow\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/grid-auto-flow\",\"$ref\":{\"file\":\"tailwind/flexbox/grid-auto-flow.mdx\"}},{\"$id\":\"tailwind/flexbox/grid-auto-rows.mdx\",\"type\":\"page\",\"name\":\"Grid Auto Rows\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/grid-auto-rows\",\"$ref\":{\"file\":\"tailwind/flexbox/grid-auto-rows.mdx\"}},{\"$id\":\"tailwind/flexbox/grid-column.mdx\",\"type\":\"page\",\"name\":\"Grid Column Start / End\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/grid-column\",\"$ref\":{\"file\":\"tailwind/flexbox/grid-column.mdx\"}},{\"$id\":\"tailwind/flexbox/grid-row.mdx\",\"type\":\"page\",\"name\":\"Grid Row Start / End\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/grid-row\",\"$ref\":{\"file\":\"tailwind/flexbox/grid-row.mdx\"}},{\"$id\":\"tailwind/flexbox/grid-template-columns.mdx\",\"type\":\"page\",\"name\":\"Grid Template Columns\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/grid-template-columns\",\"$ref\":{\"file\":\"tailwind/flexbox/grid-template-columns.mdx\"}},{\"$id\":\"tailwind/flexbox/grid-template-rows.mdx\",\"type\":\"page\",\"name\":\"Grid Template Rows\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/grid-template-rows\",\"$ref\":{\"file\":\"tailwind/flexbox/grid-template-rows.mdx\"}},{\"$id\":\"tailwind/flexbox/justify-content.mdx\",\"type\":\"page\",\"name\":\"Justify Content\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/justify-content\",\"$ref\":{\"file\":\"tailwind/flexbox/justify-content.mdx\"}},{\"$id\":\"tailwind/flexbox/justify-items.mdx\",\"type\":\"page\",\"name\":\"Justify Items\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/justify-items\",\"$ref\":{\"file\":\"tailwind/flexbox/justify-items.mdx\"}},{\"$id\":\"tailwind/flexbox/justify-self.mdx\",\"type\":\"page\",\"name\":\"Justify Self\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/justify-self\",\"$ref\":{\"file\":\"tailwind/flexbox/justify-self.mdx\"}},{\"$id\":\"tailwind/flexbox/order.mdx\",\"type\":\"page\",\"name\":\"Order\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/order\",\"$ref\":{\"file\":\"tailwind/flexbox/order.mdx\"}},{\"$id\":\"tailwind/flexbox/place-content.mdx\",\"type\":\"page\",\"name\":\"Place Items\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/place-content\",\"$ref\":{\"file\":\"tailwind/flexbox/place-content.mdx\"}},{\"$id\":\"tailwind/flexbox/place-items.mdx\",\"type\":\"page\",\"name\":\"Place Content\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/place-items\",\"$ref\":{\"file\":\"tailwind/flexbox/place-items.mdx\"}},{\"$id\":\"tailwind/flexbox/place-self.mdx\",\"type\":\"page\",\"name\":\"Place Self\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/flexbox/place-self\",\"$ref\":{\"file\":\"tailwind/flexbox/place-self.mdx\"}},{\"$id\":\"#42\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Spacing\"},{\"$id\":\"tailwind/spacing/margin.mdx\",\"type\":\"page\",\"name\":\"Margin\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/spacing/margin\",\"$ref\":{\"file\":\"tailwind/spacing/margin.mdx\"}},{\"$id\":\"tailwind/spacing/padding.mdx\",\"type\":\"page\",\"name\":\"Padding\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/spacing/padding\",\"$ref\":{\"file\":\"tailwind/spacing/padding.mdx\"}},{\"$id\":\"tailwind/spacing/space-between.mdx\",\"type\":\"page\",\"name\":\"Space Between\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/spacing/space-between\",\"$ref\":{\"file\":\"tailwind/spacing/space-between.mdx\"}},{\"$id\":\"#44\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Sizing\"},{\"$id\":\"tailwind/sizing/height.mdx\",\"type\":\"page\",\"name\":\"Height\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/sizing/height\",\"$ref\":{\"file\":\"tailwind/sizing/height.mdx\"}},{\"$id\":\"tailwind/sizing/max-height.mdx\",\"type\":\"page\",\"name\":\"Max-Height\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/sizing/max-height\",\"$ref\":{\"file\":\"tailwind/sizing/max-height.mdx\"}},{\"$id\":\"tailwind/sizing/max-width.mdx\",\"type\":\"page\",\"name\":\"Max-Width\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/sizing/max-width\",\"$ref\":{\"file\":\"tailwind/sizing/max-width.mdx\"}},{\"$id\":\"tailwind/sizing/min-height.mdx\",\"type\":\"page\",\"name\":\"Min-Height\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/sizing/min-height\",\"$ref\":{\"file\":\"tailwind/sizing/min-height.mdx\"}},{\"$id\":\"tailwind/sizing/min-width.mdx\",\"type\":\"page\",\"name\":\"Min-Width\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/sizing/min-width\",\"$ref\":{\"file\":\"tailwind/sizing/min-width.mdx\"}},{\"$id\":\"tailwind/sizing/width.mdx\",\"type\":\"page\",\"name\":\"Width\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/sizing/width\",\"$ref\":{\"file\":\"tailwind/sizing/width.mdx\"}},{\"$id\":\"#46\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Typography\"},{\"$id\":\"tailwind/typography/content.mdx\",\"type\":\"page\",\"name\":\"Content\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/content\",\"$ref\":{\"file\":\"tailwind/typography/content.mdx\"}},{\"$id\":\"tailwind/typography/font-family.mdx\",\"type\":\"page\",\"name\":\"Font Family\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/font-family\",\"$ref\":{\"file\":\"tailwind/typography/font-family.mdx\"}},{\"$id\":\"tailwind/typography/font-size.mdx\",\"type\":\"page\",\"name\":\"Font Size\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/font-size\",\"$ref\":{\"file\":\"tailwind/typography/font-size.mdx\"}},{\"$id\":\"tailwind/typography/font-smoothing.mdx\",\"type\":\"page\",\"name\":\"Font Smoothing\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/font-smoothing\",\"$ref\":{\"file\":\"tailwind/typography/font-smoothing.mdx\"}},{\"$id\":\"tailwind/typography/font-style.mdx\",\"type\":\"page\",\"name\":\"Font Style\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/font-style\",\"$ref\":{\"file\":\"tailwind/typography/font-style.mdx\"}},{\"$id\":\"tailwind/typography/font-variant-numeric.mdx\",\"type\":\"page\",\"name\":\"Font Variant Numeric\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/font-variant-numeric\",\"$ref\":{\"file\":\"tailwind/typography/font-variant-numeric.mdx\"}},{\"$id\":\"tailwind/typography/font-weight.mdx\",\"type\":\"page\",\"name\":\"Font Weight\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/font-weight\",\"$ref\":{\"file\":\"tailwind/typography/font-weight.mdx\"}},{\"$id\":\"tailwind/typography/hyphens.mdx\",\"type\":\"page\",\"name\":\"Hyphens\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/hyphens\",\"$ref\":{\"file\":\"tailwind/typography/hyphens.mdx\"}},{\"$id\":\"tailwind/typography/letter-spacing.mdx\",\"type\":\"page\",\"name\":\"Letter Spacing\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/letter-spacing\",\"$ref\":{\"file\":\"tailwind/typography/letter-spacing.mdx\"}},{\"$id\":\"tailwind/typography/line-clamp.mdx\",\"type\":\"page\",\"name\":\"Line Clamp\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/line-clamp\",\"$ref\":{\"file\":\"tailwind/typography/line-clamp.mdx\"}},{\"$id\":\"tailwind/typography/line-height.mdx\",\"type\":\"page\",\"name\":\"Line Height\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/line-height\",\"$ref\":{\"file\":\"tailwind/typography/line-height.mdx\"}},{\"$id\":\"tailwind/typography/list-style-image.mdx\",\"type\":\"page\",\"name\":\"List Style Image\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/list-style-image\",\"$ref\":{\"file\":\"tailwind/typography/list-style-image.mdx\"}},{\"$id\":\"tailwind/typography/list-style-position.mdx\",\"type\":\"page\",\"name\":\"List Style Position\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/list-style-position\",\"$ref\":{\"file\":\"tailwind/typography/list-style-position.mdx\"}},{\"$id\":\"tailwind/typography/list-style-type.mdx\",\"type\":\"page\",\"name\":\"List Style Type\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/list-style-type\",\"$ref\":{\"file\":\"tailwind/typography/list-style-type.mdx\"}},{\"$id\":\"tailwind/typography/text-align.mdx\",\"type\":\"page\",\"name\":\"Text Transform\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-align\",\"$ref\":{\"file\":\"tailwind/typography/text-align.mdx\"}},{\"$id\":\"tailwind/typography/text-color.mdx\",\"type\":\"page\",\"name\":\"Text Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-color\",\"$ref\":{\"file\":\"tailwind/typography/text-color.mdx\"}},{\"$id\":\"tailwind/typography/text-decoration.mdx\",\"type\":\"page\",\"name\":\"Text Decoration\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-decoration\",\"$ref\":{\"file\":\"tailwind/typography/text-decoration.mdx\"}},{\"$id\":\"tailwind/typography/text-decoration-color.mdx\",\"type\":\"page\",\"name\":\"Text Decoration Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-decoration-color\",\"$ref\":{\"file\":\"tailwind/typography/text-decoration-color.mdx\"}},{\"$id\":\"tailwind/typography/text-decoration-style.mdx\",\"type\":\"page\",\"name\":\"Text Decoration Style\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-decoration-style\",\"$ref\":{\"file\":\"tailwind/typography/text-decoration-style.mdx\"}},{\"$id\":\"tailwind/typography/text-decoration-thickness.mdx\",\"type\":\"page\",\"name\":\"Text Decoration Thickness\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-decoration-thickness\",\"$ref\":{\"file\":\"tailwind/typography/text-decoration-thickness.mdx\"}},{\"$id\":\"tailwind/typography/text-indent.mdx\",\"type\":\"page\",\"name\":\"Text Indent\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-indent\",\"$ref\":{\"file\":\"tailwind/typography/text-indent.mdx\"}},{\"$id\":\"tailwind/typography/text-overflow.mdx\",\"type\":\"page\",\"name\":\"Text Overflow\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-overflow\",\"$ref\":{\"file\":\"tailwind/typography/text-overflow.mdx\"}},{\"$id\":\"tailwind/typography/text-transform.mdx\",\"type\":\"page\",\"name\":\"Text Align\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-transform\",\"$ref\":{\"file\":\"tailwind/typography/text-transform.mdx\"}},{\"$id\":\"tailwind/typography/text-underline-offset.mdx\",\"type\":\"page\",\"name\":\"Text Underline Offset\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/text-underline-offset\",\"$ref\":{\"file\":\"tailwind/typography/text-underline-offset.mdx\"}},{\"$id\":\"tailwind/typography/vertical-align.mdx\",\"type\":\"page\",\"name\":\"Vertical Align\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/vertical-align\",\"$ref\":{\"file\":\"tailwind/typography/vertical-align.mdx\"}},{\"$id\":\"tailwind/typography/whitespace.mdx\",\"type\":\"page\",\"name\":\"Whitespace\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/whitespace\",\"$ref\":{\"file\":\"tailwind/typography/whitespace.mdx\"}},{\"$id\":\"tailwind/typography/word-break.mdx\",\"type\":\"page\",\"name\":\"Word Break\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/typography/word-break\",\"$ref\":{\"file\":\"tailwind/typography/word-break.mdx\"}},{\"$id\":\"#48\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Backgrounds\"},{\"$id\":\"tailwind/backgrounds/background-attachment.mdx\",\"type\":\"page\",\"name\":\"Background Attachment\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/backgrounds/background-attachment\",\"$ref\":{\"file\":\"tailwind/backgrounds/background-attachment.mdx\"}},{\"$id\":\"tailwind/backgrounds/background-clip.mdx\",\"type\":\"page\",\"name\":\"Background Clip\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/backgrounds/background-clip\",\"$ref\":{\"file\":\"tailwind/backgrounds/background-clip.mdx\"}},{\"$id\":\"tailwind/backgrounds/background-color.mdx\",\"type\":\"page\",\"name\":\"Background Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/backgrounds/background-color\",\"$ref\":{\"file\":\"tailwind/backgrounds/background-color.mdx\"}},{\"$id\":\"tailwind/backgrounds/background-image.mdx\",\"type\":\"page\",\"name\":\"Background Image\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/backgrounds/background-image\",\"$ref\":{\"file\":\"tailwind/backgrounds/background-image.mdx\"}},{\"$id\":\"tailwind/backgrounds/background-origin.mdx\",\"type\":\"page\",\"name\":\"Background Origin\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/backgrounds/background-origin\",\"$ref\":{\"file\":\"tailwind/backgrounds/background-origin.mdx\"}},{\"$id\":\"tailwind/backgrounds/background-position.mdx\",\"type\":\"page\",\"name\":\"Background Position\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/backgrounds/background-position\",\"$ref\":{\"file\":\"tailwind/backgrounds/background-position.mdx\"}},{\"$id\":\"tailwind/backgrounds/background-repeat.mdx\",\"type\":\"page\",\"name\":\"Background Repeat\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/backgrounds/background-repeat\",\"$ref\":{\"file\":\"tailwind/backgrounds/background-repeat.mdx\"}},{\"$id\":\"tailwind/backgrounds/background-size.mdx\",\"type\":\"page\",\"name\":\"Background Size\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/backgrounds/background-size\",\"$ref\":{\"file\":\"tailwind/backgrounds/background-size.mdx\"}},{\"$id\":\"tailwind/backgrounds/gradient-color-stops.mdx\",\"type\":\"page\",\"name\":\"Gradient Color Stops\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/backgrounds/gradient-color-stops\",\"$ref\":{\"file\":\"tailwind/backgrounds/gradient-color-stops.mdx\"}},{\"$id\":\"#50\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Borders\"},{\"$id\":\"tailwind/borders/border-color.mdx\",\"type\":\"page\",\"name\":\"Border Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/border-color\",\"$ref\":{\"file\":\"tailwind/borders/border-color.mdx\"}},{\"$id\":\"tailwind/borders/border-radius.mdx\",\"type\":\"page\",\"name\":\"Border Radius\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/border-radius\",\"$ref\":{\"file\":\"tailwind/borders/border-radius.mdx\"}},{\"$id\":\"tailwind/borders/border-style.mdx\",\"type\":\"page\",\"name\":\"Border Style\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/border-style\",\"$ref\":{\"file\":\"tailwind/borders/border-style.mdx\"}},{\"$id\":\"tailwind/borders/border-width.mdx\",\"type\":\"page\",\"name\":\"Border Width\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/border-width\",\"$ref\":{\"file\":\"tailwind/borders/border-width.mdx\"}},{\"$id\":\"tailwind/borders/divide-color.mdx\",\"type\":\"page\",\"name\":\"Divide Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/divide-color\",\"$ref\":{\"file\":\"tailwind/borders/divide-color.mdx\"}},{\"$id\":\"tailwind/borders/divide-style.mdx\",\"type\":\"page\",\"name\":\"Divide Style\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/divide-style\",\"$ref\":{\"file\":\"tailwind/borders/divide-style.mdx\"}},{\"$id\":\"tailwind/borders/divide-width.mdx\",\"type\":\"page\",\"name\":\"Divide Width\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/divide-width\",\"$ref\":{\"file\":\"tailwind/borders/divide-width.mdx\"}},{\"$id\":\"tailwind/borders/outline-color.mdx\",\"type\":\"page\",\"name\":\"Outline Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/outline-color\",\"$ref\":{\"file\":\"tailwind/borders/outline-color.mdx\"}},{\"$id\":\"tailwind/borders/outline-offset.mdx\",\"type\":\"page\",\"name\":\"Outline Offset\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/outline-offset\",\"$ref\":{\"file\":\"tailwind/borders/outline-offset.mdx\"}},{\"$id\":\"tailwind/borders/outline-style.mdx\",\"type\":\"page\",\"name\":\"Outline Style\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/outline-style\",\"$ref\":{\"file\":\"tailwind/borders/outline-style.mdx\"}},{\"$id\":\"tailwind/borders/outline-width.mdx\",\"type\":\"page\",\"name\":\"Outline Width\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/outline-width\",\"$ref\":{\"file\":\"tailwind/borders/outline-width.mdx\"}},{\"$id\":\"tailwind/borders/ring-color.mdx\",\"type\":\"page\",\"name\":\"Ring Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/ring-color\",\"$ref\":{\"file\":\"tailwind/borders/ring-color.mdx\"}},{\"$id\":\"tailwind/borders/ring-offset-color.mdx\",\"type\":\"page\",\"name\":\"Ring Offset Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/ring-offset-color\",\"$ref\":{\"file\":\"tailwind/borders/ring-offset-color.mdx\"}},{\"$id\":\"tailwind/borders/ring-offset-width.mdx\",\"type\":\"page\",\"name\":\"Ring Offset Width\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/ring-offset-width\",\"$ref\":{\"file\":\"tailwind/borders/ring-offset-width.mdx\"}},{\"$id\":\"tailwind/borders/ring-width.mdx\",\"type\":\"page\",\"name\":\"Ring Width\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/borders/ring-width\",\"$ref\":{\"file\":\"tailwind/borders/ring-width.mdx\"}},{\"$id\":\"#52\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Effects\"},{\"$id\":\"tailwind/effects/background-blend-mode.mdx\",\"type\":\"page\",\"name\":\"Background Blend Mode\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/effects/background-blend-mode\",\"$ref\":{\"file\":\"tailwind/effects/background-blend-mode.mdx\"}},{\"$id\":\"tailwind/effects/box-shadow.mdx\",\"type\":\"page\",\"name\":\"Box Shadow\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/effects/box-shadow\",\"$ref\":{\"file\":\"tailwind/effects/box-shadow.mdx\"}},{\"$id\":\"tailwind/effects/box-shadow-color.mdx\",\"type\":\"page\",\"name\":\"Box Shadow Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/effects/box-shadow-color\",\"$ref\":{\"file\":\"tailwind/effects/box-shadow-color.mdx\"}},{\"$id\":\"tailwind/effects/mix-blend-mode.mdx\",\"type\":\"page\",\"name\":\"Mix Blend Mode\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/effects/mix-blend-mode\",\"$ref\":{\"file\":\"tailwind/effects/mix-blend-mode.mdx\"}},{\"$id\":\"tailwind/effects/opacity.mdx\",\"type\":\"page\",\"name\":\"Opacity\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/effects/opacity\",\"$ref\":{\"file\":\"tailwind/effects/opacity.mdx\"}},{\"$id\":\"#54\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Transitions \u0026 Animation\"},{\"$id\":\"tailwind/transitions-animation/animation.mdx\",\"type\":\"page\",\"name\":\"Animation\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transitions-animation/animation\",\"$ref\":{\"file\":\"tailwind/transitions-animation/animation.mdx\"}},{\"$id\":\"tailwind/transitions-animation/transition-delay.mdx\",\"type\":\"page\",\"name\":\"Transition Delay\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transitions-animation/transition-delay\",\"$ref\":{\"file\":\"tailwind/transitions-animation/transition-delay.mdx\"}},{\"$id\":\"tailwind/transitions-animation/transition-duration.mdx\",\"type\":\"page\",\"name\":\"Transition Duration\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transitions-animation/transition-duration\",\"$ref\":{\"file\":\"tailwind/transitions-animation/transition-duration.mdx\"}},{\"$id\":\"tailwind/transitions-animation/transition-property.mdx\",\"type\":\"page\",\"name\":\"Transition Property\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transitions-animation/transition-property\",\"$ref\":{\"file\":\"tailwind/transitions-animation/transition-property.mdx\"}},{\"$id\":\"tailwind/transitions-animation/transition-timing-function.mdx\",\"type\":\"page\",\"name\":\"Transition Timing Function\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transitions-animation/transition-timing-function\",\"$ref\":{\"file\":\"tailwind/transitions-animation/transition-timing-function.mdx\"}},{\"$id\":\"#56\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Transforms\"},{\"$id\":\"tailwind/transforms/rotate.mdx\",\"type\":\"page\",\"name\":\"Rotate\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transforms/rotate\",\"$ref\":{\"file\":\"tailwind/transforms/rotate.mdx\"}},{\"$id\":\"tailwind/transforms/scale.mdx\",\"type\":\"page\",\"name\":\"Scale\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transforms/scale\",\"$ref\":{\"file\":\"tailwind/transforms/scale.mdx\"}},{\"$id\":\"tailwind/transforms/skew.mdx\",\"type\":\"page\",\"name\":\"Skew\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transforms/skew\",\"$ref\":{\"file\":\"tailwind/transforms/skew.mdx\"}},{\"$id\":\"tailwind/transforms/transform-origin.mdx\",\"type\":\"page\",\"name\":\"Transform Origin\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transforms/transform-origin\",\"$ref\":{\"file\":\"tailwind/transforms/transform-origin.mdx\"}},{\"$id\":\"tailwind/transforms/translate.mdx\",\"type\":\"page\",\"name\":\"Translate\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/transforms/translate\",\"$ref\":{\"file\":\"tailwind/transforms/translate.mdx\"}},{\"$id\":\"#58\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Interactivity\"},{\"$id\":\"tailwind/interactivity/accent-color.mdx\",\"type\":\"page\",\"name\":\"Accent Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/accent-color\",\"$ref\":{\"file\":\"tailwind/interactivity/accent-color.mdx\"}},{\"$id\":\"tailwind/interactivity/appearance.mdx\",\"type\":\"page\",\"name\":\"Appearance\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/appearance\",\"$ref\":{\"file\":\"tailwind/interactivity/appearance.mdx\"}},{\"$id\":\"tailwind/interactivity/caret-color.mdx\",\"type\":\"page\",\"name\":\"Caret Color\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/caret-color\",\"$ref\":{\"file\":\"tailwind/interactivity/caret-color.mdx\"}},{\"$id\":\"tailwind/interactivity/cursor.mdx\",\"type\":\"page\",\"name\":\"Cursor\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/cursor\",\"$ref\":{\"file\":\"tailwind/interactivity/cursor.mdx\"}},{\"$id\":\"tailwind/interactivity/pointer-events.mdx\",\"type\":\"page\",\"name\":\"Pointer Events\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/pointer-events\",\"$ref\":{\"file\":\"tailwind/interactivity/pointer-events.mdx\"}},{\"$id\":\"tailwind/interactivity/resize.mdx\",\"type\":\"page\",\"name\":\"Resize\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/resize\",\"$ref\":{\"file\":\"tailwind/interactivity/resize.mdx\"}},{\"$id\":\"tailwind/interactivity/scroll-behaviour.mdx\",\"type\":\"page\",\"name\":\"Scroll Behavior\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/scroll-behaviour\",\"$ref\":{\"file\":\"tailwind/interactivity/scroll-behaviour.mdx\"}},{\"$id\":\"tailwind/interactivity/scroll-margin.mdx\",\"type\":\"page\",\"name\":\"Scroll Margin\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/scroll-margin\",\"$ref\":{\"file\":\"tailwind/interactivity/scroll-margin.mdx\"}},{\"$id\":\"tailwind/interactivity/scroll-padding.mdx\",\"type\":\"page\",\"name\":\"Scroll Padding\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/scroll-padding\",\"$ref\":{\"file\":\"tailwind/interactivity/scroll-padding.mdx\"}},{\"$id\":\"tailwind/interactivity/scroll-snap-align.mdx\",\"type\":\"page\",\"name\":\"Scroll Snap Align\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/scroll-snap-align\",\"$ref\":{\"file\":\"tailwind/interactivity/scroll-snap-align.mdx\"}},{\"$id\":\"tailwind/interactivity/scroll-snap-stop.mdx\",\"type\":\"page\",\"name\":\"Scroll Snap Stop\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/scroll-snap-stop\",\"$ref\":{\"file\":\"tailwind/interactivity/scroll-snap-stop.mdx\"}},{\"$id\":\"tailwind/interactivity/scroll-snap-type.mdx\",\"type\":\"page\",\"name\":\"Scroll Snap Type\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/scroll-snap-type\",\"$ref\":{\"file\":\"tailwind/interactivity/scroll-snap-type.mdx\"}},{\"$id\":\"tailwind/interactivity/touch-action.mdx\",\"type\":\"page\",\"name\":\"Touch Action\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/touch-action\",\"$ref\":{\"file\":\"tailwind/interactivity/touch-action.mdx\"}},{\"$id\":\"tailwind/interactivity/user-select.mdx\",\"type\":\"page\",\"name\":\"User Select\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/user-select\",\"$ref\":{\"file\":\"tailwind/interactivity/user-select.mdx\"}},{\"$id\":\"tailwind/interactivity/will-change.mdx\",\"type\":\"page\",\"name\":\"Will Change\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/interactivity/will-change\",\"$ref\":{\"file\":\"tailwind/interactivity/will-change.mdx\"}},{\"$id\":\"#60\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"SVG\"},{\"$id\":\"tailwind/svg/fill.mdx\",\"type\":\"page\",\"name\":\"Fill\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/svg/fill\",\"$ref\":{\"file\":\"tailwind/svg/fill.mdx\"}},{\"$id\":\"tailwind/svg/stroke.mdx\",\"type\":\"page\",\"name\":\"Stroke\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/svg/stroke\",\"$ref\":{\"file\":\"tailwind/svg/stroke.mdx\"}},{\"$id\":\"tailwind/svg/stroke-width.mdx\",\"type\":\"page\",\"name\":\"Stroke Width\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/svg/stroke-width\",\"$ref\":{\"file\":\"tailwind/svg/stroke-width.mdx\"}},{\"$id\":\"#62\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Accessibility\"},{\"$id\":\"tailwind/accessibility/screen-readers.mdx\",\"type\":\"page\",\"name\":\"Screen Readers\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/accessibility/screen-readers\",\"$ref\":{\"file\":\"tailwind/accessibility/screen-readers.mdx\"}},{\"$id\":\"#64\",\"type\":\"separator\",\"icon\":\"$undefined\",\"name\":\"Plugins\"},{\"$id\":\"tailwind/plugins/container-queries.mdx\",\"type\":\"page\",\"name\":\"Container Queries\",\"description\":\"$undefined\",\"icon\":\"$undefined\",\"url\":\"/docs/tailwind/plugins/container-queries\",\"$ref\":{\"file\":\"tailwind/plugins/container-queries.mdx\"}}]},\"children\":[\"$\",\"$L8\",null,{\"transparentMode\":\"top\",\"children\":[\"$\",\"main\",null,{\"id\":\"nd-docs-layout\",\"className\":\"flex w-full flex-1 flex-row pe-(--fd-layout-offset) [--fd-nav-height:calc(var(--spacing)*14)] [--fd-tocnav-height:36px] md:[--fd-sidebar-width:286px] xl:[--fd-toc-width:286px] xl:[--fd-tocnav-height:0px]\",\"style\":{\"--fd-layout-offset\":\"max(calc(50vw - var(--fd-layout-width) / 2), 0px)\"},\"children\":[[\"$\",\"$L9\",null,{\"className\":\"md:ps-(--fd-layout-offset) bg-transparent\",\"inner\":{\"className\":\"md:pt-2.5\"},\"children\":[[\"$\",\"$La\",null,{\"children\":[false,\"$undefined\",[\"$\",\"div\",null,{\"className\":\"flex flex-col gap-4 pt-2 lg:hidden\",\"children\":[\"$\",\"$L5\",null,{\"href\":\"/docs\",\"className\":\"text-sm flex flex-row items-center gap-2 rounded-md p-2 text-start [overflow-wrap:anywhere] md:py-1.5 [\u0026_svg]:size-4 [\u0026_svg]:shrink-0 bg-fd-primary/10 text-fd-primary\",\"style\":{\"paddingInlineStart\":\"calc(var(--spacing) * 2)\"},\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-book-open\",\"children\":[[\"$\",\"path\",\"1akyts\",{\"d\":\"M12 7v14\"}],[\"$\",\"path\",\"ruj8y\",{\"d\":\"M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z\"}],\"$undefined\"]}],\"Docs\"]}]}],null]}],[\"$\",\"$Lb\",null,{\"children\":[false,[[\"$\",\"$Lc\",\"0\",{\"href\":\"https://github.com/nativewind/nativewind\",\"icon\":[\"$\",\"svg\",null,{\"role\":\"img\",\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\",\"children\":[\"$\",\"path\",null,{\"d\":\"M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12\"}]}],\"external\":true,\"className\":\"lg:hidden\",\"children\":\"Github\"}]],[\"$\",\"$Ld\",null,{\"components\":\"$undefined\"}]]}],[\"$\",\"$Le\",null,{\"className\":\"flex flex-row items-center md:hidden\",\"children\":[null,[\"$\",\"$Lf\",null,{\"className\":\"md:hidden\",\"mode\":\"light-dark\"}],\"$undefined\"]}]]}],[\"$\",\"$L10\",null,{\"style\":{\"paddingInlineStart\":\"var(--fd-layout-offset)\"},\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-row border-b border-fd-foreground/10 px-4 h-14 lg:px-36\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-row items-center flex-1 pe-4\",\"children\":[null,[\"$\",\"$L11\",null,{}],[\"$\",\"$L5\",null,{\"href\":\"/\",\"className\":\"inline-flex items-center gap-2.5 font-semibold group\",\"children\":[\"$\",\"svg\",null,{\"xmlns\":\"http://www.w3.org/2000/svg\",\"fill\":\"none\",\"viewBox\":\"0 0 590 110\",\"className\":\"h-6 group-hover:text-fd-primary duration-300\",\"children\":[[\"$\",\"path\",null,{\"fill\":\"currentColor\",\"d\":\"$12\"}],[\"$\",\"path\",null,{\"fill\":\"currentColor\",\"d\":\"M53.784 21.904c.5-8.877 8.697-16.048 17.73-14.752l.331.052c6.939 1.156 11.565 7.015 12.222 13.385.698 6.76-2.975 13.804-11.616 17.543-14.547 6.294-18.427 5.793-45.693 12.193l-2.713.641-.186.04a3.68 3.68 0 0 1-1.701-7.15l.182-.049 2.797-.66c28.056-6.59 30.607-5.804 44.393-11.769 5.983-2.588 7.554-6.772 7.218-10.034-.356-3.44-2.758-6.245-5.967-6.856l-.313-.052c-4.56-.655-9.066 3.108-9.337 7.873l-.01.227-.01.19a3.68 3.68 0 0 1-7.346-.21v-.188z\"}],[\"$\",\"path\",null,{\"fill\":\"currentColor\",\"fillRule\":\"evenodd\",\"d\":\"$13\",\"clipRule\":\"evenodd\"}],[\"$\",\"path\",null,{\"fill\":\"currentColor\",\"d\":\"$14\"}]]}]}],[\"$\",\"$L15\",null,{\"options\":[{\"title\":\"v4\",\"url\":\"/docs\"},{\"title\":\"v2\",\"url\":\"https://v2.nativewind.dev/\"}]}]]}],[\"$\",\"$L16\",null,{\"hideIfDisabled\":true,\"className\":\"w-full my-auto rounded-xl max-md:hidden max-w-sm px-2\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-1 flex-row items-center justify-end\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-row items-center gap-6 px-4 empty:hidden max-lg:hidden\",\"children\":[]}],\"$undefined\",[\"$\",\"$L17\",null,{\"hideIfDisabled\":true,\"className\":\"md:hidden\"}],[\"$\",\"$Lf\",null,{\"className\":\"mr-2 max-md:hidden\",\"mode\":\"light-dark-system\"}],[\"$\",\"$L18\",null,{\"className\":\"md:hidden\"}],[[\"$\",\"$L19\",\"0\",{\"item\":{\"type\":\"icon\",\"url\":\"https://github.com/nativewind/nativewind\",\"text\":\"Github\",\"label\":\"GitHub\",\"icon\":\"$0:f:0:1:2:children:1:props:children:1:props:children:props:children:props:children:0:props:children:1:props:children:1:0:props:icon\",\"external\":true},\"className\":\"inline-flex items-center justify-center text-sm font-medium transition-colors duration-100 disabled:pointer-events-none disabled:opacity-50 hover:bg-fd-accent hover:text-fd-accent-foreground p-1.5 [\u0026_svg]:size-4.5 text-fd-muted-foreground max-lg:hidden rounded-full border\",\"aria-label\":\"GitHub\",\"children\":\"$0:f:0:1:2:children:1:props:children:1:props:children:props:children:props:children:0:props:children:1:props:children:1:0:props:icon\"}]],null]}]]}],null]}],[\"$\",\"$L1a\",null,{\"tocNav\":\"xl:hidden\",\"toc\":\"max-xl:hidden\",\"page\":\"mt-(--fd-nav-height)\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-0 xl:right-1/2 right-0 translate-x-1/2 -z-10 -translate-y-1/2 w-[64rem] h-[64rem] rounded-full bg-fd-primary/10 max-md:hidden [--mask:radial-gradient(circle_at_center,red,transparent_69%)] [mask-image:var(--mask)] [webkit-mask-image:var(--mask)] pointer-events-none\"}],[\"$\",\"div\",null,{\"className\":\"fixed top-0 xl:right-1/2 right-0 translate-x-1/2 -z-10 -translate-y-1/2 w-[64rem] h-[64rem] rounded-full bg-fd-primary/5 max-md:hidden [--mask:radial-gradient(circle_at_center,red,transparent_69%)] [mask-image:var(--mask)] [webkit-mask-image:var(--mask)] pointer-events-none\"}],[\"$\",\"div\",null,{\"className\":\"absolute top-0 xl:right-1/2 right-0 translate-x-1/2 -z-10 h-[64rem] w-[64rem] bg-grid-lines-xl dark:opacity-80 -translate-y-1/2 max-md:hidden [--mask:radial-gradient(circle_at_center_top,red,transparent)] [mask-image:var(--mask)] [webkit-mask-image:var(--mask)] -skew-20 pointer-events-none\"}],[\"$\",\"$L3\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L4\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}]]}]}]}]]}],{\"children\":[[\"slug\",\"guides/troubleshooting\",\"oc\"],[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L3\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L4\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"__PAGE__\",[\"$\",\"$1\",\"c\",{\"children\":[\"$L1b\",[\"$\",\"$L1c\",null,{\"children\":\"$L1d\"}],null,[\"$\",\"$L1e\",null,{\"children\":[\"$L1f\",\"$L20\",[\"$\",\"$L21\",null,{\"promise\":\"$@22\"}]]}]]}],{},null,false]},null,false]},null,false]},null,false],[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$1\",\"MfcSQ_HqPDqhzRseZ28Dc\",{\"children\":[[\"$\",\"$L23\",null,{\"children\":\"$L24\"}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}],null]}],false]],\"m\":\"$undefined\",\"G\":[\"$25\",\"$undefined\"],\"s\":false,\"S\":true}\n"])</script><script>self.__next_f.push([1,"26:\"$Sreact.suspense\"\n27:I[4911,[],\"AsyncMetadata\"]\n29:I[6441,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"AnchorProvider\"]\n2a:I[3406,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"PageBody\"]\n2b:I[3406,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"TocPopover\"]\n2c:I[3406,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"TocPopoverTrigger\"]\n2d:I[3406,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"TocPopoverContent\"]\n2e:I[8070,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"T"])</script><script>self.__next_f.push([1,"OCScrollArea\"]\n2f:I[8070,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"TOCItems\"]\n30:I[3406,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"PageArticle\"]\n31:I[3406,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"Breadcrumb\"]\n32:I[7242,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"CodeBlock\"]\n34:I[7242,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"Pre\"]\n35:I[8532,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"Tabs\"]\n36:I[8532,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\""])</script><script>self.__next_f.push([1,",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"Tab\"]\n38:I[3406,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"Footer\"]\n39:I[8070,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"Toc\"]\n3a:I[9697,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"I18nLabel\"]\n3b:I[1778,[\"769\",\"static/chunks/769-8af0dd6ba1917f5d.js\",\"857\",\"static/chunks/857-9d435cd9637ba7a9.js\",\"993\",\"static/chunks/993-3e8f4916e432e2f6.js\",\"711\",\"static/chunks/711-fc912928148f438c.js\",\"637\",\"static/chunks/637-c682ed75bce4e9f9.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-d60e743d5bbf02fa.js\"],\"default\"]\n1d:[\"$\",\"$26\",null,{\"fallback\":null,\"children\":[\"$\",\"$L27\",null,{\"promise\":\"$@28\"}]}]\n33:Tb41,"])</script><script>self.__next_f.push([1,"\u003csvg viewBox=\"0 0 24 24\"\u003e\u003cpath d=\"M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z\" fill=\"currentColor\" /\u003e\u003c/svg\u003e"])</script><script>self.__next_f.push([1,"37:Tb41,"])</script><script>self.__next_f.push([1,"\u003csvg viewBox=\"0 0 24 24\"\u003e\u003cpath d=\"M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z\" fill=\"currentColor\" /\u003e\u003c/svg\u003e"])</script><script>self.__next_f.push([1,"1b:[\"$\",\"$L29\",null,{\"toc\":[{\"depth\":2,\"url\":\"#verifying-nativewind-installation\",\"title\":\"Verifying Nativewind Installation\"},{\"depth\":2,\"url\":\"#enabling-debug-mode\",\"title\":\"Enabling debug mode\"},{\"depth\":2,\"url\":\"#common-issues\",\"title\":\"Common Issues\"},{\"depth\":3,\"url\":\"#your-cache-is-loading-old-data\",\"title\":\"Your cache is loading old data\"},{\"depth\":3,\"url\":\"#colors-are-not-working\",\"title\":\"Colors are not working\"},{\"depth\":3,\"url\":\"#modifiers-are-not-working\",\"title\":\"Modifiers are not working\"},{\"depth\":3,\"url\":\"#explicit-styles\",\"title\":\"Explicit styles\"},{\"depth\":3,\"url\":\"#dp-vs-px\",\"title\":\"dp vs px\"},{\"depth\":3,\"url\":\"#flex\",\"title\":\"Flex\"},{\"depth\":3,\"url\":\"#flex-direction\",\"title\":\"Flex Direction\"}],\"single\":false,\"children\":[[\"$\",\"$L2a\",null,{\"className\":\"\",\"style\":{\"--fd-tocnav-height\":\"$undefined\"},\"children\":[[\"$\",\"$L2b\",null,{\"className\":\"h-10\",\"children\":[[\"$\",\"$L2c\",null,{\"className\":\"w-full\",\"items\":\"$1b:props:toc\"}],[\"$\",\"$L2d\",null,{\"children\":[\"$undefined\",[\"$\",\"$L2e\",null,{\"isMenu\":true,\"children\":[\"$\",\"$L2f\",null,{\"items\":\"$1b:props:toc\"}]}],\"$undefined\"]}]]}],[\"$\",\"$L30\",null,{\"className\":\"max-w-[860px]\",\"children\":[[\"$\",\"$L31\",null,{}],[[\"$\",\"h1\",null,{\"ref\":\"$undefined\",\"children\":\"Troubleshooting\",\"className\":\"text-3xl font-semibold\"}],null,[\"$\",\"p\",null,{\"className\":\"text-sm text-muted-foreground mb-4 italic\",\"children\":[\"Last updated on \",\"May 30th, 2025\"]}],[\"$\",\"div\",null,{\"ref\":\"$undefined\",\"children\":[\"\\n\",[\"$\",\"div\",null,{\"ref\":\"$undefined\",\"className\":\"my-6 flex flex-row gap-2 rounded-lg border border-s-2 bg-fd-card p-3 text-sm text-fd-card-foreground shadow-md border-s-emerald-500 dark:border-s-emerald-300\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-lightbulb size-5 stroke-emerald-500 dark:stroke-emerald-300\",\"children\":[[\"$\",\"path\",\"1gvzjb\",{\"d\":\"M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5\"}],[\"$\",\"path\",\"x1upvd\",{\"d\":\"M9 18h6\"}],[\"$\",\"path\",\"ceow96\",{\"d\":\"M10 22h4\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"min-w-0 flex-1\",\"children\":[null,[\"$\",\"div\",null,{\"className\":\"text-fd-muted-foreground prose-no-margin\",\"children\":[[\"$\",\"p\",null,{\"children\":\"While troubleshooting, always start your application without the cache!\"}],[\"$\",\"ul\",null,{\"children\":[\"\\n\",[\"$\",\"li\",null,{\"children\":[\"Expo \",[\"$\",\"code\",null,{\"children\":\"npx expo start --clear\"}]]}],\"\\n\",[\"$\",\"li\",null,{\"children\":[\"React Native CLI \",[\"$\",\"code\",null,{\"children\":\"npx react-native start --reset-cache\"}]]}],\"\\n\"]}]]}]]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"Before troubleshooting Nativewind, it's crucial to ensure that Tailwind CSS itself is functioning correctly. Nativewind uses the Tailwind CLI to compile your styles, so any issues with Tailwind CLI should be resolved first. Using the command \",[\"$\",\"code\",null,{\"children\":\"npx tailwindcss --input \u003cinput.css\u003e --output output.css\"}],\", Tailwind CLI will generate an \",[\"$\",\"code\",null,{\"children\":\"output.css\"}],\" file. If you are troubleshooting a class that is not working, ensure that the css rule is present in the \",[\"$\",\"code\",null,{\"children\":\"output.css\"}],\" file.\"]}],\"\\n\",[\"$\",\"h2\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"verifying-nativewind-installation\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#verifying-nativewind-installation\",\"className\":\"peer\",\"children\":\"Verifying Nativewind Installation\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"Nativewind provides a utility function \",[\"$\",\"code\",null,{\"children\":\"verifyInstallation()\"}],\" designed to help confirm that the package has been correctly installed.\"]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"Import the \",[\"$\",\"code\",null,{\"children\":\"verifyInstallation\"}],\" function from the Nativewind package and run within the scope of a React component. \",[\"$\",\"strong\",null,{\"children\":\"Do not invoke this function on the global scope\"}],\", it should be run within a component.\"]}],\"\\n\",[\"$\",\"$L32\",null,{\"className\":\"shiki shiki-themes github-light github-dark\",\"style\":{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},\"tabIndex\":\"0\",\"icon\":\"$33\",\"children\":[\"$\",\"$L34\",null,{\"children\":[\"$\",\"code\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"import\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" React \"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"from\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},\"children\":\" 'react'\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\";\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"import\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" { verifyInstallation } \"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"from\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},\"children\":\" 'nativewind'\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\";\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":\" \"}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"function\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},\"children\":\" App\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"() {\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},\"children\":\" // Ensure to call inside a component, not globally\"}]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},\"children\":\" verifyInstallation\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"();\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":\" \"}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\" return\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" (\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},\"children\":\" // Your component JSX here...\"}]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" );\"}]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"}\"}]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":\" \"}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"export\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\" default\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" App;\"}]]}]]}]}]}],\"\\n\",[\"$\",\"h2\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"enabling-debug-mode\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#enabling-debug-mode\",\"className\":\"peer\",\"children\":\"Enabling debug mode\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"Nativewind supports the \",[\"$\",\"code\",null,{\"children\":\"DEBUG\"}],\" environment variable and will output various debug information while your server is running.\"]}],\"\\n\",[\"$\",\"$L35\",null,{\"groupId\":\"Troubleshooting\",\"items\":[\"osx\",\"windows\"],\"children\":[[\"$\",\"$L36\",null,{\"value\":\"osx\",\"label\":\"Mac / Linux\",\"children\":[\"$\",\"$L32\",null,{\"className\":\"shiki shiki-themes github-light github-dark\",\"style\":{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},\"tabIndex\":\"0\",\"icon\":\"\u003csvg viewBox=\\\"0 0 24 24\\\"\u003e\u003cpath d=\\\"m 4,4 a 1,1 0 0 0 -0.7070312,0.2929687 1,1 0 0 0 0,1.4140625 L 8.5859375,11 3.2929688,16.292969 a 1,1 0 0 0 0,1.414062 1,1 0 0 0 1.4140624,0 l 5.9999998,-6 a 1.0001,1.0001 0 0 0 0,-1.414062 L 4.7070312,4.2929687 A 1,1 0 0 0 4,4 Z m 8,14 a 1,1 0 0 0 -1,1 1,1 0 0 0 1,1 h 8 a 1,1 0 0 0 1,-1 1,1 0 0 0 -1,-1 z\\\" fill=\\\"currentColor\\\" /\u003e\u003c/svg\u003e\",\"children\":[\"$\",\"$L34\",null,{\"children\":[\"$\",\"code\",null,{\"children\":[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"DEBUG\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"=\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},\"children\":\"nativewind\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" \u003cstart-command\u003e\"}]]}]}]}]}]}],[\"$\",\"$L36\",null,{\"value\":\"windows\",\"label\":\"Windows\",\"children\":[\"$\",\"$L32\",null,{\"className\":\"shiki shiki-themes github-light github-dark\",\"style\":{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},\"tabIndex\":\"0\",\"icon\":\"\u003csvg viewBox=\\\"0 0 24 24\\\"\u003e\u003cpath d=\\\"m 4,4 a 1,1 0 0 0 -0.7070312,0.2929687 1,1 0 0 0 0,1.4140625 L 8.5859375,11 3.2929688,16.292969 a 1,1 0 0 0 0,1.414062 1,1 0 0 0 1.4140624,0 l 5.9999998,-6 a 1.0001,1.0001 0 0 0 0,-1.414062 L 4.7070312,4.2929687 A 1,1 0 0 0 4,4 Z m 8,14 a 1,1 0 0 0 -1,1 1,1 0 0 0 1,1 h 8 a 1,1 0 0 0 1,-1 1,1 0 0 0 -1,-1 z\\\" fill=\\\"currentColor\\\" /\u003e\u003c/svg\u003e\",\"children\":[\"$\",\"$L34\",null,{\"children\":[\"$\",\"code\",null,{\"children\":[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},\"children\":\"set\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},\"children\":\" \\\"DEBUG=nativewind\\\"\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\" \u003c\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},\"children\":\"start-comman\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"d\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"\u003e\"}]]}]}]}]}]}]]}],\"\\n\",[\"$\",\"div\",null,{\"ref\":\"$undefined\",\"className\":\"my-6 flex flex-row gap-2 rounded-lg border border-s-2 bg-fd-card p-3 text-sm text-fd-card-foreground shadow-md border-s-orange-500 dark:border-s-orange-400\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-triangle-alert size-5 fill-orange-500 dark:fill-orange-400 text-fd-card\",\"children\":[[\"$\",\"path\",\"wmoenq\",{\"d\":\"m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3\"}],[\"$\",\"path\",\"juzpu7\",{\"d\":\"M12 9v4\"}],[\"$\",\"path\",\"p32p05\",{\"d\":\"M12 17h.01\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"min-w-0 flex-1\",\"children\":[null,[\"$\",\"div\",null,{\"className\":\"text-fd-muted-foreground prose-no-margin\",\"children\":[\"$\",\"p\",null,{\"children\":[\"@react-native-community/cli may create multiple terminal sessions. You will need to ensure all sessions have \",[\"$\",\"code\",null,{\"children\":\"DEBUG=nativewind\"}],\" set.\"]}]}]]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":\"By itself, this information may or may not be useful to you, but it is extremely useful when reporting to the developers on GitHub. You can record the terminal output by redirecting the output to a file.\"}],\"\\n\",[\"$\",\"$L35\",null,{\"groupId\":\"Troubleshooting\",\"items\":[\"osx\",\"windows\"],\"children\":[[\"$\",\"$L36\",null,{\"value\":\"osx\",\"label\":\"Mac / Linux\",\"children\":[\"$\",\"$L32\",null,{\"className\":\"shiki shiki-themes github-light github-dark\",\"style\":{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},\"tabIndex\":\"0\",\"icon\":\"\u003csvg viewBox=\\\"0 0 24 24\\\"\u003e\u003cpath d=\\\"m 4,4 a 1,1 0 0 0 -0.7070312,0.2929687 1,1 0 0 0 0,1.4140625 L 8.5859375,11 3.2929688,16.292969 a 1,1 0 0 0 0,1.414062 1,1 0 0 0 1.4140624,0 l 5.9999998,-6 a 1.0001,1.0001 0 0 0 0,-1.414062 L 4.7070312,4.2929687 A 1,1 0 0 0 4,4 Z m 8,14 a 1,1 0 0 0 -1,1 1,1 0 0 0 1,1 h 8 a 1,1 0 0 0 1,-1 1,1 0 0 0 -1,-1 z\\\" fill=\\\"currentColor\\\" /\u003e\u003c/svg\u003e\",\"children\":[\"$\",\"$L34\",null,{\"children\":[\"$\",\"code\",null,{\"children\":[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"DEBUG\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"=\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},\"children\":\"nativewind\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},\"children\":\" script\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},\"children\":\" output.log\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\" \u003c\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},\"children\":\"start-comman\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"d\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"\u003e\"}]]}]}]}]}]}],[\"$\",\"$L36\",null,{\"value\":\"windows\",\"label\":\"Windows\",\"children\":[\"$\",\"p\",null,{\"children\":\"If you know how to record the terminal command in a one-liner script, please open a PR to add it here.\"}]}]]}],\"\\n\",[\"$\",\"h2\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"common-issues\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#common-issues\",\"className\":\"peer\",\"children\":\"Common Issues\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"h3\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"your-cache-is-loading-old-data\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#your-cache-is-loading-old-data\",\"className\":\"peer\",\"children\":\"Your cache is loading old data\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":\"Always reset your cache before troubleshooting an issue.\"}],\"\\n\",[\"$\",\"h3\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"colors-are-not-working\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#colors-are-not-working\",\"className\":\"peer\",\"children\":\"Colors are not working\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":\"React Native styling is much more restrictive than the web. This code will work on the web, but not on React Native:\"}],\"\\n\",[\"$\",\"$L32\",null,{\"className\":\"shiki shiki-themes github-light github-dark\",\"style\":{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},\"tabIndex\":\"0\",\"icon\":\"$37\",\"children\":[\"$\",\"$L34\",null,{\"children\":[\"$\",\"code\",null,{\"children\":[[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"export\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\" function\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},\"children\":\" App\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"() {\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\" return\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" (\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" \u003c\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},\"children\":\"View\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},\"children\":\" className\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},\"children\":\"=\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},\"children\":\"\\\"text-red-500\\\"\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"\u003e\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" \u003c\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},\"children\":\"Text\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"\u003eHello, World!\u003c/\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},\"children\":\"Text\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"\u003e\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" \u003c/\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},\"children\":\"View\"}],[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"\u003e\"}]]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\" );\"}]}],\"\\n\",[\"$\",\"span\",null,{\"className\":\"line\",\"children\":[\"$\",\"span\",null,{\"style\":{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},\"children\":\"}\"}]}]]}]}]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"The reason is that \",[\"$\",\"code\",null,{\"children\":\"\u003cView /\u003e\"}],\" does not accept a \",[\"$\",\"code\",null,{\"children\":\"color\"}],\" style and will not cascade the style! Instead, you must move the color classes to the \",[\"$\",\"code\",null,{\"children\":\"\u003cText /\u003e\"}],\" element\"]}],\"\\n\",[\"$\",\"h3\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"modifiers-are-not-working\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#modifiers-are-not-working\",\"className\":\"peer\",\"children\":\"Modifiers are not working\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"Ensure the component you are applying the style to supports both the style and the required props (e.g \",[\"$\",\"code\",null,{\"children\":\"hover:text-white\"}],\" - does the component support \",[\"$\",\"code\",null,{\"children\":\"color\"}],\" styles and have an \",[\"$\",\"code\",null,{\"children\":\"onHover\"}],\" prop?)\"]}],\"\\n\",[\"$\",\"h3\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"explicit-styles\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#explicit-styles\",\"className\":\"peer\",\"children\":\"Explicit styles\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":\"React Native has various issues when conditionally applying styles. To prevent these issues it's best to declare all styles.\"}],\"\\n\",[\"$\",\"p\",null,{\"children\":\"For example, instead of only applying a text color for dark mode, provide both a light and dark mode text color.\"}],\"\\n\",[\"$\",\"h3\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"dp-vs-px\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#dp-vs-px\",\"className\":\"peer\",\"children\":\"dp vs px\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"React Native's default unit is density-independent pixels (dp) while the web's default is pixels (px). These two units are different, however Nativewind treats them as if they are equivalent. Additionally, the Nativewind's compiler requires a unit for most numeric values forcing some styles to use a \",[\"$\",\"code\",null,{\"children\":\"px\"}],\" unit.\"]}],\"\\n\",[\"$\",\"h3\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"flex\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#flex\",\"className\":\"peer\",\"children\":\"Flex\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"React Native uses a different base flex definition to the web. This can be fixed by adding \",[\"$\",\"code\",null,{\"children\":\"flex-1\"}],\" to your classes, which forces the platforms to align.\"]}],\"\\n\",[\"$\",\"h3\",null,{\"className\":\"flex scroll-m-28 flex-row items-center gap-2\",\"id\":\"flex-direction\",\"children\":[[\"$\",\"a\",null,{\"data-card\":\"\",\"href\":\"#flex-direction\",\"className\":\"peer\",\"children\":\"Flex Direction\"}],[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-link size-3.5 shrink-0 text-fd-muted-foreground opacity-0 transition-opacity peer-hover:opacity-100\",\"aria-label\":\"Link to section\",\"children\":[[\"$\",\"path\",\"1cjeqo\",{\"d\":\"M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71\"}],[\"$\",\"path\",\"19qd67\",{\"d\":\"M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71\"}],\"$undefined\"]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"React Native uses a different default \",[\"$\",\"code\",null,{\"children\":\"flex-direction\"}],\" to the web. This can be fixed by explicitly setting a \",[\"$\",\"code\",null,{\"children\":\"flex-direction\"}]]}]],\"className\":\"prose\"}]],[\"$\",\"div\",null,{\"role\":\"none\",\"className\":\"flex-1\"}],[\"$\",\"div\",null,{\"className\":\"flex flex-row flex-wrap items-center justify-between gap-4 empty:hidden\",\"children\":[null,null]}],[\"$\",\"$L38\",null,{\"items\":\"$undefined\"}]]}]]}],[\"$\",\"$L39\",null,{\"children\":[\"$undefined\",[\"$\",\"h3\",null,{\"className\":\"inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-text size-4\",\"children\":[[\"$\",\"path\",\"olowqp\",{\"d\":\"M15 18H3\"}],[\"$\",\"path\",\"16j9eg\",{\"d\":\"M17 6H3\"}],[\"$\",\"path\",\"2avoz0\",{\"d\":\"M21 12H3\"}],\"$undefined\"]}],[\"$\",\"$L3a\",null,{\"label\":\"toc\"}]]}],[\"$\",\"$L2e\",null,{\"children\":[\"$\",\"$L3b\",null,{\"items\":\"$1b:props:toc\"}]}],\"$undefined\"]}]]}]\n"])</script><script>self.__next_f.push([1,"20:null\n"])</script><script>self.__next_f.push([1,"24:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n1f:null\n"])</script><script>self.__next_f.push([1,"28:{\"metadata\":[[\"$\",\"title\",\"0\",{\"children\":\"Troubleshooting\"}],[\"$\",\"meta\",\"1\",{\"property\":\"og:title\",\"content\":\"Troubleshooting\"}],[\"$\",\"meta\",\"2\",{\"property\":\"og:image:type\",\"content\":\"image/png\"}],[\"$\",\"meta\",\"3\",{\"property\":\"og:image:width\",\"content\":\"1280\"}],[\"$\",\"meta\",\"4\",{\"property\":\"og:image:height\",\"content\":\"720\"}],[\"$\",\"meta\",\"5\",{\"property\":\"og:image\",\"content\":\"https://www.nativewind.dev/opengraph-image.png?a84e8d7ff09b577f\"}],[\"$\",\"meta\",\"6\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"7\",{\"name\":\"twitter:title\",\"content\":\"Troubleshooting\"}],[\"$\",\"meta\",\"8\",{\"name\":\"twitter:image:type\",\"content\":\"image/png\"}],[\"$\",\"meta\",\"9\",{\"name\":\"twitter:image:width\",\"content\":\"1280\"}],[\"$\",\"meta\",\"10\",{\"name\":\"twitter:image:height\",\"content\":\"720\"}],[\"$\",\"meta\",\"11\",{\"name\":\"twitter:image\",\"content\":\"https://www.nativewind.dev/opengraph-image.png?a84e8d7ff09b577f\"}],[\"$\",\"link\",\"12\",{\"rel\":\"icon\",\"href\":\"/favicon.svg\"}]],\"error\":null,\"digest\":\"$undefined\"}\n22:{\"metadata\":\"$28:metadata\",\"error\":null,\"digest\":\"$undefined\"}\n"])</script></body></html>