[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-clerk-clerk-custom-ui":3,"mdc-zfn4di-key":37,"related-org-clerk-clerk-custom-ui":2050,"related-repo-clerk-clerk-custom-ui":2234},{"slug":4,"name":4,"fn":5,"description":6,"org":7,"tags":11,"stars":26,"repoUrl":27,"updatedAt":28,"license":29,"forks":30,"topics":31,"repo":32,"sourceUrl":35,"mdContent":36},"clerk-custom-ui","customize Clerk UI and auth flows","Custom authentication flows and component appearance - hooks (useSignIn, useSignUp), themes, colors, fonts, CSS. Use for custom sign-in\u002Fsign-up flows, appearance styling, visual customization, branding.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},"clerk","Clerk","https:\u002F\u002Fpexgzepcugksgbtrxkhf.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Forg-logos\u002Fclerk.png",[12,14,17,20,23],{"name":9,"slug":8,"type":13},"tag",{"name":15,"slug":16,"type":13},"Authentication","authentication",{"name":18,"slug":19,"type":13},"Branding","branding",{"name":21,"slug":22,"type":13},"Frontend","frontend",{"name":24,"slug":25,"type":13},"Design","design",59,"https:\u002F\u002Fgithub.com\u002Fclerk\u002Fskills","2026-04-10T05:00:10.109158","MIT",4,[],{"repoUrl":27,"stars":26,"forks":30,"topics":33,"description":34},[],"AI Skills to enhance working with Clerk","https:\u002F\u002Fgithub.com\u002Fclerk\u002Fskills\u002Ftree\u002FHEAD\u002Fskills\u002Fcore\u002Fclerk-custom-ui","---\nname: clerk-custom-ui\ndescription: Custom authentication flows and component appearance - hooks (useSignIn,\n  useSignUp), themes, colors, fonts, CSS. Use for custom sign-in\u002Fsign-up flows, appearance\n  styling, visual customization, branding.\nallowed-tools: WebFetch\nlicense: MIT\nmetadata:\n  author: clerk\n  version: 2.3.0\n---\n\n# Custom UI\n\n> **Prerequisite**: Ensure `ClerkProvider` wraps your app. See `clerk-setup` skill.\n>\n> **Version**: Check `package.json` for the SDK version — see `clerk` skill for the version table. This determines which custom flow references to use below.\n\nThis skill covers two areas:\n1. **Custom authentication flows** — build your own sign-in\u002Fsign-up UI with hooks\n2. **Appearance customization** — theme, style, and brand Clerk's pre-built components\n\n## What Do You Need?\n\n| Task | Reference |\n|------|-----------|\n| Custom sign-in (Core 2 \u002F LTS) | core-2\u002Fcustom-sign-in.md |\n| Custom sign-up (Core 2 \u002F LTS) | core-2\u002Fcustom-sign-up.md |\n| Custom sign-in (Current SDK v7+) | core-3\u002Fcustom-sign-in.md |\n| Custom sign-up (Current SDK v7+) | core-3\u002Fcustom-sign-up.md |\n| Show component pattern (Current SDK) | core-3\u002Fshow-component.md |\n\n## Custom Flow References\n\n| Task | Core 2 | Current |\n|------|--------|---------|\n| Custom sign-in (useSignIn) | `core-2\u002Fcustom-sign-in.md` | `core-3\u002Fcustom-sign-in.md` |\n| Custom sign-up (useSignUp) | `core-2\u002Fcustom-sign-up.md` | `core-3\u002Fcustom-sign-up.md` |\n| `\u003CShow>` component | *(use `\u003CSignedIn>`, `\u003CSignedOut>`, `\u003CProtect>`)* | `core-3\u002Fshow-component.md` |\n\n---\n\n## Appearance Customization\n\nAppearance customization applies to both Core 2 and the current SDK.\n\n### Component Customization Options\n\n| Task | Documentation |\n|------|---------------|\n| Appearance prop overview | https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Foverview |\n| Options (structure, logo, buttons) | https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Flayout |\n| Themes (pre-built dark\u002Flight) | https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Fthemes |\n| Variables (colors, fonts, spacing) | https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Fvariables |\n| CAPTCHA configuration | https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Fcaptcha |\n| Bring your own CSS | https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Fbring-your-own-css |\n\n### Appearance Pattern\n\n```typescript\n\u003CSignIn\n  appearance={{\n    variables: {\n      colorPrimary: '#0000ff',\n      borderRadius: '0.5rem',\n    },\n    options: {\n      logoImageUrl: '\u002Flogo.png',\n      socialButtonsVariant: 'iconButton',\n    },\n  }}\n\u002F>\n```\n\n> **Core 2 ONLY (skip if current SDK):** The `options` property was named `layout`. Use `layout: { logoImageUrl: '...', socialButtonsVariant: '...' }` instead of `options`.\n\n### variables (colors, typography, borders)\n\n| Property | Description |\n|----------|-------------|\n| `colorPrimary` | Primary color throughout |\n| `colorBackground` | Background color |\n| `borderRadius` | Border radius (default: `0.375rem`) |\n\n**Opacity change:** `colorRing` and `colorModalBackdrop` now render at full opacity. Use explicit `rgba()` values if you need transparency.\n\n> **Core 2 ONLY (skip if current SDK):** `colorRing` and `colorModalBackdrop` rendered at 15% opacity by default.\n\n### options (structure, logo, social buttons)\n\n| Property | Description |\n|----------|-------------|\n| `logoImageUrl` | URL to custom logo |\n| `socialButtonsVariant` | `'blockButton'` \\| `'iconButton'` \\| `'auto'` |\n| `socialButtonsPlacement` | `'top'` \\| `'bottom'` |\n| `showOptionalFields` | Show optional fields (default: `false`) |\n\n> **Core 2 ONLY (skip if current SDK):** This property is called `layout`, not `options`. Also, `showOptionalFields` defaulted to `true`.\n\n### Themes\n\nInstall themes from `@clerk\u002Fui`:\n\n```bash\nnpm install @clerk\u002Fui\n```\n\n```typescript\nimport { dark } from '@clerk\u002Fui\u002Fthemes'\n\n\u003CClerkProvider appearance={{ theme: dark }} \u002F>\n```\n\n> **Core 2 ONLY (skip if current SDK):** Themes are imported from `@clerk\u002Fthemes` (install `@clerk\u002Fthemes` instead of `@clerk\u002Fui`). Example: `import { dark } from '@clerk\u002Fthemes'`.\n\n**Theme stacking** — pass an array where the last theme takes precedence:\n\n```typescript\nimport { dark, neobrutalism } from '@clerk\u002Fui\u002Fthemes'\n\n\u003CClerkProvider appearance={{ theme: [dark, neobrutalism] }} \u002F>\n```\n\n**CSS `color-scheme` support** — the default theme respects the CSS `color-scheme` property for automatic light\u002Fdark mode toggling.\n\n**Available themes:** `dark`, `neobrutalism`, `shadcn`, `simple`\n\n#### shadcn Theme\n\n> **IMPORTANT:** If the project has `components.json` (shadcn\u002Fui installed), ALWAYS apply the shadcn theme as the FIRST customization step. This ensures Clerk components visually match the existing shadcn design system. Skip this only if the user explicitly requests a different theme.\n\n**If the project uses shadcn\u002Fui** (check for `components.json` in the project root), **always use the shadcn theme**:\n\n```typescript\nimport { shadcn } from '@clerk\u002Fui\u002Fthemes'\n\n\u003CClerkProvider appearance={{ theme: shadcn }} \u002F>\n```\n\nAlso import shadcn CSS in your global styles:\n```css\n@import 'tailwindcss';\n@import '@clerk\u002Fui\u002Fthemes\u002Fshadcn.css';\n```\n\n> **Core 2 ONLY (skip if current SDK):** Import from `@clerk\u002Fthemes` and `@clerk\u002Fthemes\u002Fshadcn.css`:\n> ```typescript\n> import { shadcn } from '@clerk\u002Fthemes'\n> ```\n> ```css\n> @import '@clerk\u002Fthemes\u002Fshadcn.css';\n> ```\n\n## Workflow\n\n1. Identify customization needs (custom flow or appearance)\n2. For custom flows: check SDK version → read appropriate `core-2\u002F` or `core-3\u002F` reference\n3. For appearance: WebFetch the appropriate documentation from table above\n4. Apply appearance prop to your Clerk components or build custom flow with hooks\n\n## Common Pitfalls\n\n| Issue | Solution |\n|-------|----------|\n| Colors not applying | Use `colorPrimary` not `primaryColor` |\n| Logo not showing | Put `logoImageUrl` inside `options: {}` (or `layout: {}` in Core 2) |\n| Social buttons wrong | Add `socialButtonsVariant: 'iconButton'` in `options` (or `layout` in Core 2) |\n| Styling not working | Use appearance prop, not direct CSS (unless with bring-your-own-css) |\n| Hook returns different shape | Check SDK version — Core 2 and current have completely different `useSignIn`\u002F`useSignUp` APIs |\n\n## See Also\n\n- `clerk-setup` - Initial Clerk install\n- `clerk-nextjs-patterns` - Next.js patterns\n- `clerk-orgs` - B2B organizations\n",{"data":38,"body":42},{"name":4,"description":6,"allowed-tools":39,"license":29,"metadata":40},"WebFetch",{"author":8,"version":41},"2.3.0",{"type":43,"children":44},"root",[45,54,112,117,142,149,242,248,376,380,386,391,398,523,529,767,811,817,897,931,955,961,1086,1126,1132,1144,1171,1270,1310,1320,1435,1460,1495,1502,1523,1546,1631,1636,1695,1792,1798,1837,1843,2002,2008,2044],{"type":46,"tag":47,"props":48,"children":50},"element","h1",{"id":49},"custom-ui",[51],{"type":52,"value":53},"text","Custom UI",{"type":46,"tag":55,"props":56,"children":57},"blockquote",{},[58,87],{"type":46,"tag":59,"props":60,"children":61},"p",{},[62,68,70,77,79,85],{"type":46,"tag":63,"props":64,"children":65},"strong",{},[66],{"type":52,"value":67},"Prerequisite",{"type":52,"value":69},": Ensure ",{"type":46,"tag":71,"props":72,"children":74},"code",{"className":73},[],[75],{"type":52,"value":76},"ClerkProvider",{"type":52,"value":78}," wraps your app. See ",{"type":46,"tag":71,"props":80,"children":82},{"className":81},[],[83],{"type":52,"value":84},"clerk-setup",{"type":52,"value":86}," skill.",{"type":46,"tag":59,"props":88,"children":89},{},[90,95,97,103,105,110],{"type":46,"tag":63,"props":91,"children":92},{},[93],{"type":52,"value":94},"Version",{"type":52,"value":96},": Check ",{"type":46,"tag":71,"props":98,"children":100},{"className":99},[],[101],{"type":52,"value":102},"package.json",{"type":52,"value":104}," for the SDK version — see ",{"type":46,"tag":71,"props":106,"children":108},{"className":107},[],[109],{"type":52,"value":8},{"type":52,"value":111}," skill for the version table. This determines which custom flow references to use below.",{"type":46,"tag":59,"props":113,"children":114},{},[115],{"type":52,"value":116},"This skill covers two areas:",{"type":46,"tag":118,"props":119,"children":120},"ol",{},[121,132],{"type":46,"tag":122,"props":123,"children":124},"li",{},[125,130],{"type":46,"tag":63,"props":126,"children":127},{},[128],{"type":52,"value":129},"Custom authentication flows",{"type":52,"value":131}," — build your own sign-in\u002Fsign-up UI with hooks",{"type":46,"tag":122,"props":133,"children":134},{},[135,140],{"type":46,"tag":63,"props":136,"children":137},{},[138],{"type":52,"value":139},"Appearance customization",{"type":52,"value":141}," — theme, style, and brand Clerk's pre-built components",{"type":46,"tag":143,"props":144,"children":146},"h2",{"id":145},"what-do-you-need",[147],{"type":52,"value":148},"What Do You Need?",{"type":46,"tag":150,"props":151,"children":152},"table",{},[153,172],{"type":46,"tag":154,"props":155,"children":156},"thead",{},[157],{"type":46,"tag":158,"props":159,"children":160},"tr",{},[161,167],{"type":46,"tag":162,"props":163,"children":164},"th",{},[165],{"type":52,"value":166},"Task",{"type":46,"tag":162,"props":168,"children":169},{},[170],{"type":52,"value":171},"Reference",{"type":46,"tag":173,"props":174,"children":175},"tbody",{},[176,190,203,216,229],{"type":46,"tag":158,"props":177,"children":178},{},[179,185],{"type":46,"tag":180,"props":181,"children":182},"td",{},[183],{"type":52,"value":184},"Custom sign-in (Core 2 \u002F LTS)",{"type":46,"tag":180,"props":186,"children":187},{},[188],{"type":52,"value":189},"core-2\u002Fcustom-sign-in.md",{"type":46,"tag":158,"props":191,"children":192},{},[193,198],{"type":46,"tag":180,"props":194,"children":195},{},[196],{"type":52,"value":197},"Custom sign-up (Core 2 \u002F LTS)",{"type":46,"tag":180,"props":199,"children":200},{},[201],{"type":52,"value":202},"core-2\u002Fcustom-sign-up.md",{"type":46,"tag":158,"props":204,"children":205},{},[206,211],{"type":46,"tag":180,"props":207,"children":208},{},[209],{"type":52,"value":210},"Custom sign-in (Current SDK v7+)",{"type":46,"tag":180,"props":212,"children":213},{},[214],{"type":52,"value":215},"core-3\u002Fcustom-sign-in.md",{"type":46,"tag":158,"props":217,"children":218},{},[219,224],{"type":46,"tag":180,"props":220,"children":221},{},[222],{"type":52,"value":223},"Custom sign-up (Current SDK v7+)",{"type":46,"tag":180,"props":225,"children":226},{},[227],{"type":52,"value":228},"core-3\u002Fcustom-sign-up.md",{"type":46,"tag":158,"props":230,"children":231},{},[232,237],{"type":46,"tag":180,"props":233,"children":234},{},[235],{"type":52,"value":236},"Show component pattern (Current SDK)",{"type":46,"tag":180,"props":238,"children":239},{},[240],{"type":52,"value":241},"core-3\u002Fshow-component.md",{"type":46,"tag":143,"props":243,"children":245},{"id":244},"custom-flow-references",[246],{"type":52,"value":247},"Custom Flow References",{"type":46,"tag":150,"props":249,"children":250},{},[251,271],{"type":46,"tag":154,"props":252,"children":253},{},[254],{"type":46,"tag":158,"props":255,"children":256},{},[257,261,266],{"type":46,"tag":162,"props":258,"children":259},{},[260],{"type":52,"value":166},{"type":46,"tag":162,"props":262,"children":263},{},[264],{"type":52,"value":265},"Core 2",{"type":46,"tag":162,"props":267,"children":268},{},[269],{"type":52,"value":270},"Current",{"type":46,"tag":173,"props":272,"children":273},{},[274,298,322],{"type":46,"tag":158,"props":275,"children":276},{},[277,282,290],{"type":46,"tag":180,"props":278,"children":279},{},[280],{"type":52,"value":281},"Custom sign-in (useSignIn)",{"type":46,"tag":180,"props":283,"children":284},{},[285],{"type":46,"tag":71,"props":286,"children":288},{"className":287},[],[289],{"type":52,"value":189},{"type":46,"tag":180,"props":291,"children":292},{},[293],{"type":46,"tag":71,"props":294,"children":296},{"className":295},[],[297],{"type":52,"value":215},{"type":46,"tag":158,"props":299,"children":300},{},[301,306,314],{"type":46,"tag":180,"props":302,"children":303},{},[304],{"type":52,"value":305},"Custom sign-up (useSignUp)",{"type":46,"tag":180,"props":307,"children":308},{},[309],{"type":46,"tag":71,"props":310,"children":312},{"className":311},[],[313],{"type":52,"value":202},{"type":46,"tag":180,"props":315,"children":316},{},[317],{"type":46,"tag":71,"props":318,"children":320},{"className":319},[],[321],{"type":52,"value":228},{"type":46,"tag":158,"props":323,"children":324},{},[325,336,368],{"type":46,"tag":180,"props":326,"children":327},{},[328,334],{"type":46,"tag":71,"props":329,"children":331},{"className":330},[],[332],{"type":52,"value":333},"\u003CShow>",{"type":52,"value":335}," component",{"type":46,"tag":180,"props":337,"children":338},{},[339],{"type":46,"tag":340,"props":341,"children":342},"em",{},[343,345,351,353,359,360,366],{"type":52,"value":344},"(use ",{"type":46,"tag":71,"props":346,"children":348},{"className":347},[],[349],{"type":52,"value":350},"\u003CSignedIn>",{"type":52,"value":352},", ",{"type":46,"tag":71,"props":354,"children":356},{"className":355},[],[357],{"type":52,"value":358},"\u003CSignedOut>",{"type":52,"value":352},{"type":46,"tag":71,"props":361,"children":363},{"className":362},[],[364],{"type":52,"value":365},"\u003CProtect>",{"type":52,"value":367},")",{"type":46,"tag":180,"props":369,"children":370},{},[371],{"type":46,"tag":71,"props":372,"children":374},{"className":373},[],[375],{"type":52,"value":241},{"type":46,"tag":377,"props":378,"children":379},"hr",{},[],{"type":46,"tag":143,"props":381,"children":383},{"id":382},"appearance-customization",[384],{"type":52,"value":385},"Appearance Customization",{"type":46,"tag":59,"props":387,"children":388},{},[389],{"type":52,"value":390},"Appearance customization applies to both Core 2 and the current SDK.",{"type":46,"tag":392,"props":393,"children":395},"h3",{"id":394},"component-customization-options",[396],{"type":52,"value":397},"Component Customization Options",{"type":46,"tag":150,"props":399,"children":400},{},[401,416],{"type":46,"tag":154,"props":402,"children":403},{},[404],{"type":46,"tag":158,"props":405,"children":406},{},[407,411],{"type":46,"tag":162,"props":408,"children":409},{},[410],{"type":52,"value":166},{"type":46,"tag":162,"props":412,"children":413},{},[414],{"type":52,"value":415},"Documentation",{"type":46,"tag":173,"props":417,"children":418},{},[419,438,455,472,489,506],{"type":46,"tag":158,"props":420,"children":421},{},[422,427],{"type":46,"tag":180,"props":423,"children":424},{},[425],{"type":52,"value":426},"Appearance prop overview",{"type":46,"tag":180,"props":428,"children":429},{},[430],{"type":46,"tag":431,"props":432,"children":436},"a",{"href":433,"rel":434},"https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Foverview",[435],"nofollow",[437],{"type":52,"value":433},{"type":46,"tag":158,"props":439,"children":440},{},[441,446],{"type":46,"tag":180,"props":442,"children":443},{},[444],{"type":52,"value":445},"Options (structure, logo, buttons)",{"type":46,"tag":180,"props":447,"children":448},{},[449],{"type":46,"tag":431,"props":450,"children":453},{"href":451,"rel":452},"https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Flayout",[435],[454],{"type":52,"value":451},{"type":46,"tag":158,"props":456,"children":457},{},[458,463],{"type":46,"tag":180,"props":459,"children":460},{},[461],{"type":52,"value":462},"Themes (pre-built dark\u002Flight)",{"type":46,"tag":180,"props":464,"children":465},{},[466],{"type":46,"tag":431,"props":467,"children":470},{"href":468,"rel":469},"https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Fthemes",[435],[471],{"type":52,"value":468},{"type":46,"tag":158,"props":473,"children":474},{},[475,480],{"type":46,"tag":180,"props":476,"children":477},{},[478],{"type":52,"value":479},"Variables (colors, fonts, spacing)",{"type":46,"tag":180,"props":481,"children":482},{},[483],{"type":46,"tag":431,"props":484,"children":487},{"href":485,"rel":486},"https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Fvariables",[435],[488],{"type":52,"value":485},{"type":46,"tag":158,"props":490,"children":491},{},[492,497],{"type":46,"tag":180,"props":493,"children":494},{},[495],{"type":52,"value":496},"CAPTCHA configuration",{"type":46,"tag":180,"props":498,"children":499},{},[500],{"type":46,"tag":431,"props":501,"children":504},{"href":502,"rel":503},"https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Fcaptcha",[435],[505],{"type":52,"value":502},{"type":46,"tag":158,"props":507,"children":508},{},[509,514],{"type":46,"tag":180,"props":510,"children":511},{},[512],{"type":52,"value":513},"Bring your own CSS",{"type":46,"tag":180,"props":515,"children":516},{},[517],{"type":46,"tag":431,"props":518,"children":521},{"href":519,"rel":520},"https:\u002F\u002Fclerk.com\u002Fdocs\u002Fnextjs\u002Fguides\u002Fcustomizing-clerk\u002Fappearance-prop\u002Fbring-your-own-css",[435],[522],{"type":52,"value":519},{"type":46,"tag":392,"props":524,"children":526},{"id":525},"appearance-pattern",[527],{"type":52,"value":528},"Appearance Pattern",{"type":46,"tag":530,"props":531,"children":536},"pre",{"className":532,"code":533,"language":534,"meta":535,"style":535},"language-typescript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CSignIn\n  appearance={{\n    variables: {\n      colorPrimary: '#0000ff',\n      borderRadius: '0.5rem',\n    },\n    options: {\n      logoImageUrl: '\u002Flogo.png',\n      socialButtonsVariant: 'iconButton',\n    },\n  }}\n\u002F>\n","typescript","",[537],{"type":46,"tag":71,"props":538,"children":539},{"__ignoreMap":535},[540,558,572,592,625,655,664,681,711,741,749,758],{"type":46,"tag":541,"props":542,"children":545},"span",{"class":543,"line":544},"line",1,[546,552],{"type":46,"tag":541,"props":547,"children":549},{"style":548},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[550],{"type":52,"value":551},"\u003C",{"type":46,"tag":541,"props":553,"children":555},{"style":554},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[556],{"type":52,"value":557},"SignIn\n",{"type":46,"tag":541,"props":559,"children":561},{"class":543,"line":560},2,[562,567],{"type":46,"tag":541,"props":563,"children":564},{"style":554},[565],{"type":52,"value":566},"  appearance",{"type":46,"tag":541,"props":568,"children":569},{"style":548},[570],{"type":52,"value":571},"={{\n",{"type":46,"tag":541,"props":573,"children":575},{"class":543,"line":574},3,[576,582,587],{"type":46,"tag":541,"props":577,"children":579},{"style":578},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[580],{"type":52,"value":581},"    variables",{"type":46,"tag":541,"props":583,"children":584},{"style":548},[585],{"type":52,"value":586},":",{"type":46,"tag":541,"props":588,"children":589},{"style":548},[590],{"type":52,"value":591}," {\n",{"type":46,"tag":541,"props":593,"children":594},{"class":543,"line":30},[595,600,604,609,615,620],{"type":46,"tag":541,"props":596,"children":597},{"style":578},[598],{"type":52,"value":599},"      colorPrimary",{"type":46,"tag":541,"props":601,"children":602},{"style":548},[603],{"type":52,"value":586},{"type":46,"tag":541,"props":605,"children":606},{"style":548},[607],{"type":52,"value":608}," '",{"type":46,"tag":541,"props":610,"children":612},{"style":611},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[613],{"type":52,"value":614},"#0000ff",{"type":46,"tag":541,"props":616,"children":617},{"style":548},[618],{"type":52,"value":619},"'",{"type":46,"tag":541,"props":621,"children":622},{"style":548},[623],{"type":52,"value":624},",\n",{"type":46,"tag":541,"props":626,"children":628},{"class":543,"line":627},5,[629,634,638,642,647,651],{"type":46,"tag":541,"props":630,"children":631},{"style":578},[632],{"type":52,"value":633},"      borderRadius",{"type":46,"tag":541,"props":635,"children":636},{"style":548},[637],{"type":52,"value":586},{"type":46,"tag":541,"props":639,"children":640},{"style":548},[641],{"type":52,"value":608},{"type":46,"tag":541,"props":643,"children":644},{"style":611},[645],{"type":52,"value":646},"0.5rem",{"type":46,"tag":541,"props":648,"children":649},{"style":548},[650],{"type":52,"value":619},{"type":46,"tag":541,"props":652,"children":653},{"style":548},[654],{"type":52,"value":624},{"type":46,"tag":541,"props":656,"children":658},{"class":543,"line":657},6,[659],{"type":46,"tag":541,"props":660,"children":661},{"style":548},[662],{"type":52,"value":663},"    },\n",{"type":46,"tag":541,"props":665,"children":667},{"class":543,"line":666},7,[668,673,677],{"type":46,"tag":541,"props":669,"children":670},{"style":578},[671],{"type":52,"value":672},"    options",{"type":46,"tag":541,"props":674,"children":675},{"style":548},[676],{"type":52,"value":586},{"type":46,"tag":541,"props":678,"children":679},{"style":548},[680],{"type":52,"value":591},{"type":46,"tag":541,"props":682,"children":684},{"class":543,"line":683},8,[685,690,694,698,703,707],{"type":46,"tag":541,"props":686,"children":687},{"style":578},[688],{"type":52,"value":689},"      logoImageUrl",{"type":46,"tag":541,"props":691,"children":692},{"style":548},[693],{"type":52,"value":586},{"type":46,"tag":541,"props":695,"children":696},{"style":548},[697],{"type":52,"value":608},{"type":46,"tag":541,"props":699,"children":700},{"style":611},[701],{"type":52,"value":702},"\u002Flogo.png",{"type":46,"tag":541,"props":704,"children":705},{"style":548},[706],{"type":52,"value":619},{"type":46,"tag":541,"props":708,"children":709},{"style":548},[710],{"type":52,"value":624},{"type":46,"tag":541,"props":712,"children":714},{"class":543,"line":713},9,[715,720,724,728,733,737],{"type":46,"tag":541,"props":716,"children":717},{"style":578},[718],{"type":52,"value":719},"      socialButtonsVariant",{"type":46,"tag":541,"props":721,"children":722},{"style":548},[723],{"type":52,"value":586},{"type":46,"tag":541,"props":725,"children":726},{"style":548},[727],{"type":52,"value":608},{"type":46,"tag":541,"props":729,"children":730},{"style":611},[731],{"type":52,"value":732},"iconButton",{"type":46,"tag":541,"props":734,"children":735},{"style":548},[736],{"type":52,"value":619},{"type":46,"tag":541,"props":738,"children":739},{"style":548},[740],{"type":52,"value":624},{"type":46,"tag":541,"props":742,"children":744},{"class":543,"line":743},10,[745],{"type":46,"tag":541,"props":746,"children":747},{"style":548},[748],{"type":52,"value":663},{"type":46,"tag":541,"props":750,"children":752},{"class":543,"line":751},11,[753],{"type":46,"tag":541,"props":754,"children":755},{"style":548},[756],{"type":52,"value":757},"  }}\n",{"type":46,"tag":541,"props":759,"children":761},{"class":543,"line":760},12,[762],{"type":46,"tag":541,"props":763,"children":764},{"style":548},[765],{"type":52,"value":766},"\u002F>\n",{"type":46,"tag":55,"props":768,"children":769},{},[770],{"type":46,"tag":59,"props":771,"children":772},{},[773,778,780,786,788,794,796,802,804,809],{"type":46,"tag":63,"props":774,"children":775},{},[776],{"type":52,"value":777},"Core 2 ONLY (skip if current SDK):",{"type":52,"value":779}," The ",{"type":46,"tag":71,"props":781,"children":783},{"className":782},[],[784],{"type":52,"value":785},"options",{"type":52,"value":787}," property was named ",{"type":46,"tag":71,"props":789,"children":791},{"className":790},[],[792],{"type":52,"value":793},"layout",{"type":52,"value":795},". Use ",{"type":46,"tag":71,"props":797,"children":799},{"className":798},[],[800],{"type":52,"value":801},"layout: { logoImageUrl: '...', socialButtonsVariant: '...' }",{"type":52,"value":803}," instead of ",{"type":46,"tag":71,"props":805,"children":807},{"className":806},[],[808],{"type":52,"value":785},{"type":52,"value":810},".",{"type":46,"tag":392,"props":812,"children":814},{"id":813},"variables-colors-typography-borders",[815],{"type":52,"value":816},"variables (colors, typography, borders)",{"type":46,"tag":150,"props":818,"children":819},{},[820,836],{"type":46,"tag":154,"props":821,"children":822},{},[823],{"type":46,"tag":158,"props":824,"children":825},{},[826,831],{"type":46,"tag":162,"props":827,"children":828},{},[829],{"type":52,"value":830},"Property",{"type":46,"tag":162,"props":832,"children":833},{},[834],{"type":52,"value":835},"Description",{"type":46,"tag":173,"props":837,"children":838},{},[839,856,873],{"type":46,"tag":158,"props":840,"children":841},{},[842,851],{"type":46,"tag":180,"props":843,"children":844},{},[845],{"type":46,"tag":71,"props":846,"children":848},{"className":847},[],[849],{"type":52,"value":850},"colorPrimary",{"type":46,"tag":180,"props":852,"children":853},{},[854],{"type":52,"value":855},"Primary color throughout",{"type":46,"tag":158,"props":857,"children":858},{},[859,868],{"type":46,"tag":180,"props":860,"children":861},{},[862],{"type":46,"tag":71,"props":863,"children":865},{"className":864},[],[866],{"type":52,"value":867},"colorBackground",{"type":46,"tag":180,"props":869,"children":870},{},[871],{"type":52,"value":872},"Background color",{"type":46,"tag":158,"props":874,"children":875},{},[876,885],{"type":46,"tag":180,"props":877,"children":878},{},[879],{"type":46,"tag":71,"props":880,"children":882},{"className":881},[],[883],{"type":52,"value":884},"borderRadius",{"type":46,"tag":180,"props":886,"children":887},{},[888,890,896],{"type":52,"value":889},"Border radius (default: ",{"type":46,"tag":71,"props":891,"children":893},{"className":892},[],[894],{"type":52,"value":895},"0.375rem",{"type":52,"value":367},{"type":46,"tag":59,"props":898,"children":899},{},[900,905,907,913,915,921,923,929],{"type":46,"tag":63,"props":901,"children":902},{},[903],{"type":52,"value":904},"Opacity change:",{"type":52,"value":906}," ",{"type":46,"tag":71,"props":908,"children":910},{"className":909},[],[911],{"type":52,"value":912},"colorRing",{"type":52,"value":914}," and ",{"type":46,"tag":71,"props":916,"children":918},{"className":917},[],[919],{"type":52,"value":920},"colorModalBackdrop",{"type":52,"value":922}," now render at full opacity. Use explicit ",{"type":46,"tag":71,"props":924,"children":926},{"className":925},[],[927],{"type":52,"value":928},"rgba()",{"type":52,"value":930}," values if you need transparency.",{"type":46,"tag":55,"props":932,"children":933},{},[934],{"type":46,"tag":59,"props":935,"children":936},{},[937,941,942,947,948,953],{"type":46,"tag":63,"props":938,"children":939},{},[940],{"type":52,"value":777},{"type":52,"value":906},{"type":46,"tag":71,"props":943,"children":945},{"className":944},[],[946],{"type":52,"value":912},{"type":52,"value":914},{"type":46,"tag":71,"props":949,"children":951},{"className":950},[],[952],{"type":52,"value":920},{"type":52,"value":954}," rendered at 15% opacity by default.",{"type":46,"tag":392,"props":956,"children":958},{"id":957},"options-structure-logo-social-buttons",[959],{"type":52,"value":960},"options (structure, logo, social buttons)",{"type":46,"tag":150,"props":962,"children":963},{},[964,978],{"type":46,"tag":154,"props":965,"children":966},{},[967],{"type":46,"tag":158,"props":968,"children":969},{},[970,974],{"type":46,"tag":162,"props":971,"children":972},{},[973],{"type":52,"value":830},{"type":46,"tag":162,"props":975,"children":976},{},[977],{"type":52,"value":835},{"type":46,"tag":173,"props":979,"children":980},{},[981,998,1034,1062],{"type":46,"tag":158,"props":982,"children":983},{},[984,993],{"type":46,"tag":180,"props":985,"children":986},{},[987],{"type":46,"tag":71,"props":988,"children":990},{"className":989},[],[991],{"type":52,"value":992},"logoImageUrl",{"type":46,"tag":180,"props":994,"children":995},{},[996],{"type":52,"value":997},"URL to custom logo",{"type":46,"tag":158,"props":999,"children":1000},{},[1001,1010],{"type":46,"tag":180,"props":1002,"children":1003},{},[1004],{"type":46,"tag":71,"props":1005,"children":1007},{"className":1006},[],[1008],{"type":52,"value":1009},"socialButtonsVariant",{"type":46,"tag":180,"props":1011,"children":1012},{},[1013,1019,1021,1027,1028],{"type":46,"tag":71,"props":1014,"children":1016},{"className":1015},[],[1017],{"type":52,"value":1018},"'blockButton'",{"type":52,"value":1020}," | ",{"type":46,"tag":71,"props":1022,"children":1024},{"className":1023},[],[1025],{"type":52,"value":1026},"'iconButton'",{"type":52,"value":1020},{"type":46,"tag":71,"props":1029,"children":1031},{"className":1030},[],[1032],{"type":52,"value":1033},"'auto'",{"type":46,"tag":158,"props":1035,"children":1036},{},[1037,1046],{"type":46,"tag":180,"props":1038,"children":1039},{},[1040],{"type":46,"tag":71,"props":1041,"children":1043},{"className":1042},[],[1044],{"type":52,"value":1045},"socialButtonsPlacement",{"type":46,"tag":180,"props":1047,"children":1048},{},[1049,1055,1056],{"type":46,"tag":71,"props":1050,"children":1052},{"className":1051},[],[1053],{"type":52,"value":1054},"'top'",{"type":52,"value":1020},{"type":46,"tag":71,"props":1057,"children":1059},{"className":1058},[],[1060],{"type":52,"value":1061},"'bottom'",{"type":46,"tag":158,"props":1063,"children":1064},{},[1065,1074],{"type":46,"tag":180,"props":1066,"children":1067},{},[1068],{"type":46,"tag":71,"props":1069,"children":1071},{"className":1070},[],[1072],{"type":52,"value":1073},"showOptionalFields",{"type":46,"tag":180,"props":1075,"children":1076},{},[1077,1079,1085],{"type":52,"value":1078},"Show optional fields (default: ",{"type":46,"tag":71,"props":1080,"children":1082},{"className":1081},[],[1083],{"type":52,"value":1084},"false",{"type":52,"value":367},{"type":46,"tag":55,"props":1087,"children":1088},{},[1089],{"type":46,"tag":59,"props":1090,"children":1091},{},[1092,1096,1098,1103,1105,1110,1112,1117,1119,1125],{"type":46,"tag":63,"props":1093,"children":1094},{},[1095],{"type":52,"value":777},{"type":52,"value":1097}," This property is called ",{"type":46,"tag":71,"props":1099,"children":1101},{"className":1100},[],[1102],{"type":52,"value":793},{"type":52,"value":1104},", not ",{"type":46,"tag":71,"props":1106,"children":1108},{"className":1107},[],[1109],{"type":52,"value":785},{"type":52,"value":1111},". Also, ",{"type":46,"tag":71,"props":1113,"children":1115},{"className":1114},[],[1116],{"type":52,"value":1073},{"type":52,"value":1118}," defaulted to ",{"type":46,"tag":71,"props":1120,"children":1122},{"className":1121},[],[1123],{"type":52,"value":1124},"true",{"type":52,"value":810},{"type":46,"tag":392,"props":1127,"children":1129},{"id":1128},"themes",[1130],{"type":52,"value":1131},"Themes",{"type":46,"tag":59,"props":1133,"children":1134},{},[1135,1137,1143],{"type":52,"value":1136},"Install themes from ",{"type":46,"tag":71,"props":1138,"children":1140},{"className":1139},[],[1141],{"type":52,"value":1142},"@clerk\u002Fui",{"type":52,"value":586},{"type":46,"tag":530,"props":1145,"children":1149},{"className":1146,"code":1147,"language":1148,"meta":535,"style":535},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npm install @clerk\u002Fui\n","bash",[1150],{"type":46,"tag":71,"props":1151,"children":1152},{"__ignoreMap":535},[1153],{"type":46,"tag":541,"props":1154,"children":1155},{"class":543,"line":544},[1156,1161,1166],{"type":46,"tag":541,"props":1157,"children":1158},{"style":578},[1159],{"type":52,"value":1160},"npm",{"type":46,"tag":541,"props":1162,"children":1163},{"style":611},[1164],{"type":52,"value":1165}," install",{"type":46,"tag":541,"props":1167,"children":1168},{"style":611},[1169],{"type":52,"value":1170}," @clerk\u002Fui\n",{"type":46,"tag":530,"props":1172,"children":1174},{"className":532,"code":1173,"language":534,"meta":535,"style":535},"import { dark } from '@clerk\u002Fui\u002Fthemes'\n\n\u003CClerkProvider appearance={{ theme: dark }} \u002F>\n",[1175],{"type":46,"tag":71,"props":1176,"children":1177},{"__ignoreMap":535},[1178,1221,1230],{"type":46,"tag":541,"props":1179,"children":1180},{"class":543,"line":544},[1181,1187,1192,1197,1202,1207,1211,1216],{"type":46,"tag":541,"props":1182,"children":1184},{"style":1183},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[1185],{"type":52,"value":1186},"import",{"type":46,"tag":541,"props":1188,"children":1189},{"style":548},[1190],{"type":52,"value":1191}," {",{"type":46,"tag":541,"props":1193,"children":1194},{"style":554},[1195],{"type":52,"value":1196}," dark",{"type":46,"tag":541,"props":1198,"children":1199},{"style":548},[1200],{"type":52,"value":1201}," }",{"type":46,"tag":541,"props":1203,"children":1204},{"style":1183},[1205],{"type":52,"value":1206}," from",{"type":46,"tag":541,"props":1208,"children":1209},{"style":548},[1210],{"type":52,"value":608},{"type":46,"tag":541,"props":1212,"children":1213},{"style":611},[1214],{"type":52,"value":1215},"@clerk\u002Fui\u002Fthemes",{"type":46,"tag":541,"props":1217,"children":1218},{"style":548},[1219],{"type":52,"value":1220},"'\n",{"type":46,"tag":541,"props":1222,"children":1223},{"class":543,"line":560},[1224],{"type":46,"tag":541,"props":1225,"children":1227},{"emptyLinePlaceholder":1226},true,[1228],{"type":52,"value":1229},"\n",{"type":46,"tag":541,"props":1231,"children":1232},{"class":543,"line":574},[1233,1237,1242,1247,1252,1256,1260,1265],{"type":46,"tag":541,"props":1234,"children":1235},{"style":548},[1236],{"type":52,"value":551},{"type":46,"tag":541,"props":1238,"children":1239},{"style":554},[1240],{"type":52,"value":1241},"ClerkProvider appearance",{"type":46,"tag":541,"props":1243,"children":1244},{"style":548},[1245],{"type":52,"value":1246},"={{",{"type":46,"tag":541,"props":1248,"children":1249},{"style":578},[1250],{"type":52,"value":1251}," theme",{"type":46,"tag":541,"props":1253,"children":1254},{"style":548},[1255],{"type":52,"value":586},{"type":46,"tag":541,"props":1257,"children":1258},{"style":554},[1259],{"type":52,"value":1196},{"type":46,"tag":541,"props":1261,"children":1262},{"style":548},[1263],{"type":52,"value":1264}," }}",{"type":46,"tag":541,"props":1266,"children":1267},{"style":548},[1268],{"type":52,"value":1269}," \u002F>\n",{"type":46,"tag":55,"props":1271,"children":1272},{},[1273],{"type":46,"tag":59,"props":1274,"children":1275},{},[1276,1280,1282,1288,1290,1295,1296,1301,1303,1309],{"type":46,"tag":63,"props":1277,"children":1278},{},[1279],{"type":52,"value":777},{"type":52,"value":1281}," Themes are imported from ",{"type":46,"tag":71,"props":1283,"children":1285},{"className":1284},[],[1286],{"type":52,"value":1287},"@clerk\u002Fthemes",{"type":52,"value":1289}," (install ",{"type":46,"tag":71,"props":1291,"children":1293},{"className":1292},[],[1294],{"type":52,"value":1287},{"type":52,"value":803},{"type":46,"tag":71,"props":1297,"children":1299},{"className":1298},[],[1300],{"type":52,"value":1142},{"type":52,"value":1302},"). Example: ",{"type":46,"tag":71,"props":1304,"children":1306},{"className":1305},[],[1307],{"type":52,"value":1308},"import { dark } from '@clerk\u002Fthemes'",{"type":52,"value":810},{"type":46,"tag":59,"props":1311,"children":1312},{},[1313,1318],{"type":46,"tag":63,"props":1314,"children":1315},{},[1316],{"type":52,"value":1317},"Theme stacking",{"type":52,"value":1319}," — pass an array where the last theme takes precedence:",{"type":46,"tag":530,"props":1321,"children":1323},{"className":532,"code":1322,"language":534,"meta":535,"style":535},"import { dark, neobrutalism } from '@clerk\u002Fui\u002Fthemes'\n\n\u003CClerkProvider appearance={{ theme: [dark, neobrutalism] }} \u002F>\n",[1324],{"type":46,"tag":71,"props":1325,"children":1326},{"__ignoreMap":535},[1327,1372,1379],{"type":46,"tag":541,"props":1328,"children":1329},{"class":543,"line":544},[1330,1334,1338,1342,1347,1352,1356,1360,1364,1368],{"type":46,"tag":541,"props":1331,"children":1332},{"style":1183},[1333],{"type":52,"value":1186},{"type":46,"tag":541,"props":1335,"children":1336},{"style":548},[1337],{"type":52,"value":1191},{"type":46,"tag":541,"props":1339,"children":1340},{"style":554},[1341],{"type":52,"value":1196},{"type":46,"tag":541,"props":1343,"children":1344},{"style":548},[1345],{"type":52,"value":1346},",",{"type":46,"tag":541,"props":1348,"children":1349},{"style":554},[1350],{"type":52,"value":1351}," neobrutalism",{"type":46,"tag":541,"props":1353,"children":1354},{"style":548},[1355],{"type":52,"value":1201},{"type":46,"tag":541,"props":1357,"children":1358},{"style":1183},[1359],{"type":52,"value":1206},{"type":46,"tag":541,"props":1361,"children":1362},{"style":548},[1363],{"type":52,"value":608},{"type":46,"tag":541,"props":1365,"children":1366},{"style":611},[1367],{"type":52,"value":1215},{"type":46,"tag":541,"props":1369,"children":1370},{"style":548},[1371],{"type":52,"value":1220},{"type":46,"tag":541,"props":1373,"children":1374},{"class":543,"line":560},[1375],{"type":46,"tag":541,"props":1376,"children":1377},{"emptyLinePlaceholder":1226},[1378],{"type":52,"value":1229},{"type":46,"tag":541,"props":1380,"children":1381},{"class":543,"line":574},[1382,1386,1390,1394,1398,1402,1408,1413,1417,1421,1426,1431],{"type":46,"tag":541,"props":1383,"children":1384},{"style":548},[1385],{"type":52,"value":551},{"type":46,"tag":541,"props":1387,"children":1388},{"style":554},[1389],{"type":52,"value":1241},{"type":46,"tag":541,"props":1391,"children":1392},{"style":548},[1393],{"type":52,"value":1246},{"type":46,"tag":541,"props":1395,"children":1396},{"style":578},[1397],{"type":52,"value":1251},{"type":46,"tag":541,"props":1399,"children":1400},{"style":548},[1401],{"type":52,"value":586},{"type":46,"tag":541,"props":1403,"children":1405},{"style":1404},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[1406],{"type":52,"value":1407}," [",{"type":46,"tag":541,"props":1409,"children":1410},{"style":554},[1411],{"type":52,"value":1412},"dark",{"type":46,"tag":541,"props":1414,"children":1415},{"style":548},[1416],{"type":52,"value":1346},{"type":46,"tag":541,"props":1418,"children":1419},{"style":554},[1420],{"type":52,"value":1351},{"type":46,"tag":541,"props":1422,"children":1423},{"style":1404},[1424],{"type":52,"value":1425},"] ",{"type":46,"tag":541,"props":1427,"children":1428},{"style":548},[1429],{"type":52,"value":1430},"}}",{"type":46,"tag":541,"props":1432,"children":1433},{"style":548},[1434],{"type":52,"value":1269},{"type":46,"tag":59,"props":1436,"children":1437},{},[1438,1451,1453,1458],{"type":46,"tag":63,"props":1439,"children":1440},{},[1441,1443,1449],{"type":52,"value":1442},"CSS ",{"type":46,"tag":71,"props":1444,"children":1446},{"className":1445},[],[1447],{"type":52,"value":1448},"color-scheme",{"type":52,"value":1450}," support",{"type":52,"value":1452}," — the default theme respects the CSS ",{"type":46,"tag":71,"props":1454,"children":1456},{"className":1455},[],[1457],{"type":52,"value":1448},{"type":52,"value":1459}," property for automatic light\u002Fdark mode toggling.",{"type":46,"tag":59,"props":1461,"children":1462},{},[1463,1468,1469,1474,1475,1481,1482,1488,1489],{"type":46,"tag":63,"props":1464,"children":1465},{},[1466],{"type":52,"value":1467},"Available themes:",{"type":52,"value":906},{"type":46,"tag":71,"props":1470,"children":1472},{"className":1471},[],[1473],{"type":52,"value":1412},{"type":52,"value":352},{"type":46,"tag":71,"props":1476,"children":1478},{"className":1477},[],[1479],{"type":52,"value":1480},"neobrutalism",{"type":52,"value":352},{"type":46,"tag":71,"props":1483,"children":1485},{"className":1484},[],[1486],{"type":52,"value":1487},"shadcn",{"type":52,"value":352},{"type":46,"tag":71,"props":1490,"children":1492},{"className":1491},[],[1493],{"type":52,"value":1494},"simple",{"type":46,"tag":1496,"props":1497,"children":1499},"h4",{"id":1498},"shadcn-theme",[1500],{"type":52,"value":1501},"shadcn Theme",{"type":46,"tag":55,"props":1503,"children":1504},{},[1505],{"type":46,"tag":59,"props":1506,"children":1507},{},[1508,1513,1515,1521],{"type":46,"tag":63,"props":1509,"children":1510},{},[1511],{"type":52,"value":1512},"IMPORTANT:",{"type":52,"value":1514}," If the project has ",{"type":46,"tag":71,"props":1516,"children":1518},{"className":1517},[],[1519],{"type":52,"value":1520},"components.json",{"type":52,"value":1522}," (shadcn\u002Fui installed), ALWAYS apply the shadcn theme as the FIRST customization step. This ensures Clerk components visually match the existing shadcn design system. Skip this only if the user explicitly requests a different theme.",{"type":46,"tag":59,"props":1524,"children":1525},{},[1526,1531,1533,1538,1540,1545],{"type":46,"tag":63,"props":1527,"children":1528},{},[1529],{"type":52,"value":1530},"If the project uses shadcn\u002Fui",{"type":52,"value":1532}," (check for ",{"type":46,"tag":71,"props":1534,"children":1536},{"className":1535},[],[1537],{"type":52,"value":1520},{"type":52,"value":1539}," in the project root), ",{"type":46,"tag":63,"props":1541,"children":1542},{},[1543],{"type":52,"value":1544},"always use the shadcn theme",{"type":52,"value":586},{"type":46,"tag":530,"props":1547,"children":1549},{"className":532,"code":1548,"language":534,"meta":535,"style":535},"import { shadcn } from '@clerk\u002Fui\u002Fthemes'\n\n\u003CClerkProvider appearance={{ theme: shadcn }} \u002F>\n",[1550],{"type":46,"tag":71,"props":1551,"children":1552},{"__ignoreMap":535},[1553,1589,1596],{"type":46,"tag":541,"props":1554,"children":1555},{"class":543,"line":544},[1556,1560,1564,1569,1573,1577,1581,1585],{"type":46,"tag":541,"props":1557,"children":1558},{"style":1183},[1559],{"type":52,"value":1186},{"type":46,"tag":541,"props":1561,"children":1562},{"style":548},[1563],{"type":52,"value":1191},{"type":46,"tag":541,"props":1565,"children":1566},{"style":554},[1567],{"type":52,"value":1568}," shadcn",{"type":46,"tag":541,"props":1570,"children":1571},{"style":548},[1572],{"type":52,"value":1201},{"type":46,"tag":541,"props":1574,"children":1575},{"style":1183},[1576],{"type":52,"value":1206},{"type":46,"tag":541,"props":1578,"children":1579},{"style":548},[1580],{"type":52,"value":608},{"type":46,"tag":541,"props":1582,"children":1583},{"style":611},[1584],{"type":52,"value":1215},{"type":46,"tag":541,"props":1586,"children":1587},{"style":548},[1588],{"type":52,"value":1220},{"type":46,"tag":541,"props":1590,"children":1591},{"class":543,"line":560},[1592],{"type":46,"tag":541,"props":1593,"children":1594},{"emptyLinePlaceholder":1226},[1595],{"type":52,"value":1229},{"type":46,"tag":541,"props":1597,"children":1598},{"class":543,"line":574},[1599,1603,1607,1611,1615,1619,1623,1627],{"type":46,"tag":541,"props":1600,"children":1601},{"style":548},[1602],{"type":52,"value":551},{"type":46,"tag":541,"props":1604,"children":1605},{"style":554},[1606],{"type":52,"value":1241},{"type":46,"tag":541,"props":1608,"children":1609},{"style":548},[1610],{"type":52,"value":1246},{"type":46,"tag":541,"props":1612,"children":1613},{"style":578},[1614],{"type":52,"value":1251},{"type":46,"tag":541,"props":1616,"children":1617},{"style":548},[1618],{"type":52,"value":586},{"type":46,"tag":541,"props":1620,"children":1621},{"style":554},[1622],{"type":52,"value":1568},{"type":46,"tag":541,"props":1624,"children":1625},{"style":548},[1626],{"type":52,"value":1264},{"type":46,"tag":541,"props":1628,"children":1629},{"style":548},[1630],{"type":52,"value":1269},{"type":46,"tag":59,"props":1632,"children":1633},{},[1634],{"type":52,"value":1635},"Also import shadcn CSS in your global styles:",{"type":46,"tag":530,"props":1637,"children":1641},{"className":1638,"code":1639,"language":1640,"meta":535,"style":535},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","@import 'tailwindcss';\n@import '@clerk\u002Fui\u002Fthemes\u002Fshadcn.css';\n","css",[1642],{"type":46,"tag":71,"props":1643,"children":1644},{"__ignoreMap":535},[1645,1671],{"type":46,"tag":541,"props":1646,"children":1647},{"class":543,"line":544},[1648,1653,1657,1662,1666],{"type":46,"tag":541,"props":1649,"children":1650},{"style":1183},[1651],{"type":52,"value":1652},"@import",{"type":46,"tag":541,"props":1654,"children":1655},{"style":548},[1656],{"type":52,"value":608},{"type":46,"tag":541,"props":1658,"children":1659},{"style":611},[1660],{"type":52,"value":1661},"tailwindcss",{"type":46,"tag":541,"props":1663,"children":1664},{"style":548},[1665],{"type":52,"value":619},{"type":46,"tag":541,"props":1667,"children":1668},{"style":548},[1669],{"type":52,"value":1670},";\n",{"type":46,"tag":541,"props":1672,"children":1673},{"class":543,"line":560},[1674,1678,1682,1687,1691],{"type":46,"tag":541,"props":1675,"children":1676},{"style":1183},[1677],{"type":52,"value":1652},{"type":46,"tag":541,"props":1679,"children":1680},{"style":548},[1681],{"type":52,"value":608},{"type":46,"tag":541,"props":1683,"children":1684},{"style":611},[1685],{"type":52,"value":1686},"@clerk\u002Fui\u002Fthemes\u002Fshadcn.css",{"type":46,"tag":541,"props":1688,"children":1689},{"style":548},[1690],{"type":52,"value":619},{"type":46,"tag":541,"props":1692,"children":1693},{"style":548},[1694],{"type":52,"value":1670},{"type":46,"tag":55,"props":1696,"children":1697},{},[1698,1720,1762],{"type":46,"tag":59,"props":1699,"children":1700},{},[1701,1705,1707,1712,1713,1719],{"type":46,"tag":63,"props":1702,"children":1703},{},[1704],{"type":52,"value":777},{"type":52,"value":1706}," Import from ",{"type":46,"tag":71,"props":1708,"children":1710},{"className":1709},[],[1711],{"type":52,"value":1287},{"type":52,"value":914},{"type":46,"tag":71,"props":1714,"children":1716},{"className":1715},[],[1717],{"type":52,"value":1718},"@clerk\u002Fthemes\u002Fshadcn.css",{"type":52,"value":586},{"type":46,"tag":530,"props":1721,"children":1723},{"className":532,"code":1722,"language":534,"meta":535,"style":535},"import { shadcn } from '@clerk\u002Fthemes'\n",[1724],{"type":46,"tag":71,"props":1725,"children":1726},{"__ignoreMap":535},[1727],{"type":46,"tag":541,"props":1728,"children":1729},{"class":543,"line":544},[1730,1734,1738,1742,1746,1750,1754,1758],{"type":46,"tag":541,"props":1731,"children":1732},{"style":1183},[1733],{"type":52,"value":1186},{"type":46,"tag":541,"props":1735,"children":1736},{"style":548},[1737],{"type":52,"value":1191},{"type":46,"tag":541,"props":1739,"children":1740},{"style":554},[1741],{"type":52,"value":1568},{"type":46,"tag":541,"props":1743,"children":1744},{"style":548},[1745],{"type":52,"value":1201},{"type":46,"tag":541,"props":1747,"children":1748},{"style":1183},[1749],{"type":52,"value":1206},{"type":46,"tag":541,"props":1751,"children":1752},{"style":548},[1753],{"type":52,"value":608},{"type":46,"tag":541,"props":1755,"children":1756},{"style":611},[1757],{"type":52,"value":1287},{"type":46,"tag":541,"props":1759,"children":1760},{"style":548},[1761],{"type":52,"value":1220},{"type":46,"tag":530,"props":1763,"children":1765},{"className":1638,"code":1764,"language":1640,"meta":535,"style":535},"@import '@clerk\u002Fthemes\u002Fshadcn.css';\n",[1766],{"type":46,"tag":71,"props":1767,"children":1768},{"__ignoreMap":535},[1769],{"type":46,"tag":541,"props":1770,"children":1771},{"class":543,"line":544},[1772,1776,1780,1784,1788],{"type":46,"tag":541,"props":1773,"children":1774},{"style":1183},[1775],{"type":52,"value":1652},{"type":46,"tag":541,"props":1777,"children":1778},{"style":548},[1779],{"type":52,"value":608},{"type":46,"tag":541,"props":1781,"children":1782},{"style":611},[1783],{"type":52,"value":1718},{"type":46,"tag":541,"props":1785,"children":1786},{"style":548},[1787],{"type":52,"value":619},{"type":46,"tag":541,"props":1789,"children":1790},{"style":548},[1791],{"type":52,"value":1670},{"type":46,"tag":143,"props":1793,"children":1795},{"id":1794},"workflow",[1796],{"type":52,"value":1797},"Workflow",{"type":46,"tag":118,"props":1799,"children":1800},{},[1801,1806,1827,1832],{"type":46,"tag":122,"props":1802,"children":1803},{},[1804],{"type":52,"value":1805},"Identify customization needs (custom flow or appearance)",{"type":46,"tag":122,"props":1807,"children":1808},{},[1809,1811,1817,1819,1825],{"type":52,"value":1810},"For custom flows: check SDK version → read appropriate ",{"type":46,"tag":71,"props":1812,"children":1814},{"className":1813},[],[1815],{"type":52,"value":1816},"core-2\u002F",{"type":52,"value":1818}," or ",{"type":46,"tag":71,"props":1820,"children":1822},{"className":1821},[],[1823],{"type":52,"value":1824},"core-3\u002F",{"type":52,"value":1826}," reference",{"type":46,"tag":122,"props":1828,"children":1829},{},[1830],{"type":52,"value":1831},"For appearance: WebFetch the appropriate documentation from table above",{"type":46,"tag":122,"props":1833,"children":1834},{},[1835],{"type":52,"value":1836},"Apply appearance prop to your Clerk components or build custom flow with hooks",{"type":46,"tag":143,"props":1838,"children":1840},{"id":1839},"common-pitfalls",[1841],{"type":52,"value":1842},"Common Pitfalls",{"type":46,"tag":150,"props":1844,"children":1845},{},[1846,1862],{"type":46,"tag":154,"props":1847,"children":1848},{},[1849],{"type":46,"tag":158,"props":1850,"children":1851},{},[1852,1857],{"type":46,"tag":162,"props":1853,"children":1854},{},[1855],{"type":52,"value":1856},"Issue",{"type":46,"tag":162,"props":1858,"children":1859},{},[1860],{"type":52,"value":1861},"Solution",{"type":46,"tag":173,"props":1863,"children":1864},{},[1865,1891,1927,1960,1973],{"type":46,"tag":158,"props":1866,"children":1867},{},[1868,1873],{"type":46,"tag":180,"props":1869,"children":1870},{},[1871],{"type":52,"value":1872},"Colors not applying",{"type":46,"tag":180,"props":1874,"children":1875},{},[1876,1878,1883,1885],{"type":52,"value":1877},"Use ",{"type":46,"tag":71,"props":1879,"children":1881},{"className":1880},[],[1882],{"type":52,"value":850},{"type":52,"value":1884}," not ",{"type":46,"tag":71,"props":1886,"children":1888},{"className":1887},[],[1889],{"type":52,"value":1890},"primaryColor",{"type":46,"tag":158,"props":1892,"children":1893},{},[1894,1899],{"type":46,"tag":180,"props":1895,"children":1896},{},[1897],{"type":52,"value":1898},"Logo not showing",{"type":46,"tag":180,"props":1900,"children":1901},{},[1902,1904,1909,1911,1917,1919,1925],{"type":52,"value":1903},"Put ",{"type":46,"tag":71,"props":1905,"children":1907},{"className":1906},[],[1908],{"type":52,"value":992},{"type":52,"value":1910}," inside ",{"type":46,"tag":71,"props":1912,"children":1914},{"className":1913},[],[1915],{"type":52,"value":1916},"options: {}",{"type":52,"value":1918}," (or ",{"type":46,"tag":71,"props":1920,"children":1922},{"className":1921},[],[1923],{"type":52,"value":1924},"layout: {}",{"type":52,"value":1926}," in Core 2)",{"type":46,"tag":158,"props":1928,"children":1929},{},[1930,1935],{"type":46,"tag":180,"props":1931,"children":1932},{},[1933],{"type":52,"value":1934},"Social buttons wrong",{"type":46,"tag":180,"props":1936,"children":1937},{},[1938,1940,1946,1948,1953,1954,1959],{"type":52,"value":1939},"Add ",{"type":46,"tag":71,"props":1941,"children":1943},{"className":1942},[],[1944],{"type":52,"value":1945},"socialButtonsVariant: 'iconButton'",{"type":52,"value":1947}," in ",{"type":46,"tag":71,"props":1949,"children":1951},{"className":1950},[],[1952],{"type":52,"value":785},{"type":52,"value":1918},{"type":46,"tag":71,"props":1955,"children":1957},{"className":1956},[],[1958],{"type":52,"value":793},{"type":52,"value":1926},{"type":46,"tag":158,"props":1961,"children":1962},{},[1963,1968],{"type":46,"tag":180,"props":1964,"children":1965},{},[1966],{"type":52,"value":1967},"Styling not working",{"type":46,"tag":180,"props":1969,"children":1970},{},[1971],{"type":52,"value":1972},"Use appearance prop, not direct CSS (unless with bring-your-own-css)",{"type":46,"tag":158,"props":1974,"children":1975},{},[1976,1981],{"type":46,"tag":180,"props":1977,"children":1978},{},[1979],{"type":52,"value":1980},"Hook returns different shape",{"type":46,"tag":180,"props":1982,"children":1983},{},[1984,1986,1992,1994,2000],{"type":52,"value":1985},"Check SDK version — Core 2 and current have completely different ",{"type":46,"tag":71,"props":1987,"children":1989},{"className":1988},[],[1990],{"type":52,"value":1991},"useSignIn",{"type":52,"value":1993},"\u002F",{"type":46,"tag":71,"props":1995,"children":1997},{"className":1996},[],[1998],{"type":52,"value":1999},"useSignUp",{"type":52,"value":2001}," APIs",{"type":46,"tag":143,"props":2003,"children":2005},{"id":2004},"see-also",[2006],{"type":52,"value":2007},"See Also",{"type":46,"tag":2009,"props":2010,"children":2011},"ul",{},[2012,2022,2033],{"type":46,"tag":122,"props":2013,"children":2014},{},[2015,2020],{"type":46,"tag":71,"props":2016,"children":2018},{"className":2017},[],[2019],{"type":52,"value":84},{"type":52,"value":2021}," - Initial Clerk install",{"type":46,"tag":122,"props":2023,"children":2024},{},[2025,2031],{"type":46,"tag":71,"props":2026,"children":2028},{"className":2027},[],[2029],{"type":52,"value":2030},"clerk-nextjs-patterns",{"type":52,"value":2032}," - Next.js patterns",{"type":46,"tag":122,"props":2034,"children":2035},{},[2036,2042],{"type":46,"tag":71,"props":2037,"children":2039},{"className":2038},[],[2040],{"type":52,"value":2041},"clerk-orgs",{"type":52,"value":2043}," - B2B organizations",{"type":46,"tag":2045,"props":2046,"children":2047},"style",{},[2048],{"type":52,"value":2049},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"items":2051,"total":2233},[2052,2066,2081,2097,2115,2131,2149,2166,2174,2191,2205,2219],{"slug":8,"name":8,"fn":2053,"description":2054,"org":2055,"tags":2056,"stars":26,"repoUrl":27,"updatedAt":2065},"route Clerk authentication requests","Clerk authentication router. Use when user asks about Clerk CLI operations, adding authentication, setting up Clerk, custom sign-in flows, Swift or native iOS auth, native Android auth, Next.js patterns, React patterns, Vue patterns, Nuxt patterns, Astro patterns, TanStack Start patterns, Expo patterns, React Router patterns, Chrome Extension patterns, organizations, billing, subscriptions, payments, pricing, plans, seat-based pricing, feature entitlements, syncing users, testing, impersonating a user, or testing webhooks locally. Automatically routes to the specific skill based on their task.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2057,2058,2059,2062],{"name":15,"slug":16,"type":13},{"name":9,"slug":8,"type":13},{"name":2060,"slug":2061,"type":13},"Mobile","mobile",{"name":2063,"slug":2064,"type":13},"Web Development","web-development","2026-07-18T05:12:23.438307",{"slug":2067,"name":2067,"fn":2068,"description":2069,"org":2070,"tags":2071,"stars":26,"repoUrl":27,"updatedAt":2080},"clerk-android","implement Clerk auth for native Android apps","Implement Clerk authentication for native Android apps using Kotlin and Jetpack Compose with clerk-android source-guided patterns. Use for prebuilt AuthView\u002FUserButton or custom API-driven auth flows. Do not use for Expo or React Native projects.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2072,2075,2076,2079],{"name":2073,"slug":2074,"type":13},"Android","android",{"name":9,"slug":8,"type":13},{"name":2077,"slug":2078,"type":13},"Kotlin","kotlin",{"name":2060,"slug":2061,"type":13},"2026-04-10T05:00:18.622871",{"slug":2082,"name":2082,"fn":2083,"description":2084,"org":2085,"tags":2086,"stars":26,"repoUrl":27,"updatedAt":2096},"clerk-astro-patterns","implement Clerk auth in Astro apps","Astro patterns with Clerk — middleware, SSR pages, island components, API routes, static vs SSR rendering. Triggers on: astro clerk, clerk astro middleware, astro protected page, clerk island component, astro API route auth, clerk astro SSR.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2087,2090,2091,2092,2093],{"name":2088,"slug":2089,"type":13},"Astro","astro",{"name":15,"slug":16,"type":13},{"name":9,"slug":8,"type":13},{"name":21,"slug":22,"type":13},{"name":2094,"slug":2095,"type":13},"Serverless","serverless","2026-04-07T04:46:14.731808",{"slug":2098,"name":2098,"fn":2099,"description":2100,"org":2101,"tags":2102,"stars":26,"repoUrl":27,"updatedAt":2114},"clerk-backend-api","execute Clerk Backend API requests","Clerk Backend REST API explorer and executor. Browse tags, inspect endpoint schemas, and execute authenticated requests. Use when listing users, managing organizations, or calling any Clerk API endpoint.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2103,2106,2107,2110,2111],{"name":2104,"slug":2105,"type":13},"API Development","api-development",{"name":15,"slug":16,"type":13},{"name":2108,"slug":2109,"type":13},"Backend","backend",{"name":9,"slug":8,"type":13},{"name":2112,"slug":2113,"type":13},"REST API","rest-api","2026-04-10T05:00:08.728072",{"slug":2116,"name":2116,"fn":2117,"description":2118,"org":2119,"tags":2120,"stars":26,"repoUrl":27,"updatedAt":2130},"clerk-billing","manage subscriptions with Clerk Billing","Clerk Billing for subscription management - render Clerk's PricingTable and in-app checkout drawer, configure subscription plans, seat-limit plans for B2B, feature entitlements with has(), and billing webhooks. Use for SaaS monetization, plan gating, checkout flows, trials, invoicing, and subscription lifecycle management.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2121,2122,2123,2124,2127],{"name":15,"slug":16,"type":13},{"name":9,"slug":8,"type":13},{"name":21,"slug":22,"type":13},{"name":2125,"slug":2126,"type":13},"Payments","payments",{"name":2128,"slug":2129,"type":13},"SaaS","saas","2026-04-29T05:37:27.130955",{"slug":2132,"name":2132,"fn":2133,"description":2134,"org":2135,"tags":2136,"stars":26,"repoUrl":27,"updatedAt":2148},"clerk-chrome-extension-patterns","implement Clerk auth in Chrome Extensions","Chrome Extension auth with @clerk\u002Fchrome-extension -- popup\u002Fsidepanel setup, syncHost for OAuth\u002FSAML via web app, createClerkClient for service workers and headless extensions, stable CRX ID. Triggers on: Chrome extension auth, Plasmo clerk, popup sign-in, syncHost, background service worker token, createClerkClient, headless extension.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2137,2140,2141,2142,2145],{"name":2138,"slug":2139,"type":13},"Auth","auth",{"name":9,"slug":8,"type":13},{"name":21,"slug":22,"type":13},{"name":2143,"slug":2144,"type":13},"OAuth","oauth",{"name":2146,"slug":2147,"type":13},"Security","security","2026-04-07T04:46:08.489328",{"slug":2150,"name":2150,"fn":2151,"description":2152,"org":2153,"tags":2154,"stars":26,"repoUrl":27,"updatedAt":2165},"clerk-cli","manage Clerk authentication and instances via CLI","Operate the Clerk CLI (`clerk` binary) for authentication, user\u002Forg\u002Fsession management, impersonation, local webhook testing, deploy verification, instance config, env keys, feature toggles, and any Clerk Backend, Platform, or Frontend API call. Use when the user mentions Clerk management tasks, \"list clerk users\", \"impersonate a user\", \"test webhooks locally\", \"enable orgs\", \"enable billing\", \"clerk env pull\", \"clerk doctor\", \"clerk deploy\", \"clerk api\", or any ad-hoc Clerk API request. Prefer the CLI over raw HTTP: it handles auth, key resolution, app\u002Finstance targeting, and formatting automatically.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2155,2156,2157,2158,2161,2164],{"name":2104,"slug":2105,"type":13},{"name":15,"slug":16,"type":13},{"name":9,"slug":8,"type":13},{"name":2159,"slug":2160,"type":13},"CLI","cli",{"name":2162,"slug":2163,"type":13},"Deployment","deployment",{"name":2146,"slug":2147,"type":13},"2026-07-31T05:52:40.580813",{"slug":4,"name":4,"fn":5,"description":6,"org":2167,"tags":2168,"stars":26,"repoUrl":27,"updatedAt":28},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2169,2170,2171,2172,2173],{"name":15,"slug":16,"type":13},{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"name":24,"slug":25,"type":13},{"name":21,"slug":22,"type":13},{"slug":2175,"name":2175,"fn":2176,"description":2177,"org":2178,"tags":2179,"stars":26,"repoUrl":27,"updatedAt":2190},"clerk-expo","implement Clerk authentication in Expo apps","Add Clerk authentication to Expo and React Native apps using @clerk\u002Fexpo. Use for Expo setup, prebuilt native components (AuthView, UserButton), custom sign-in\u002Fsign-up flows (email, password, SMS\u002Fphone OTP, MFA), OAuth\u002FSSO, native Google\u002FApple sign-in, Expo Router protected routes, biometrics, and push notifications. Do not use for native Swift\u002FiOS, native Android\u002FKotlin, or web-only framework projects.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2180,2181,2182,2185,2186,2187],{"name":15,"slug":16,"type":13},{"name":9,"slug":8,"type":13},{"name":2183,"slug":2184,"type":13},"Expo","expo",{"name":21,"slug":22,"type":13},{"name":2060,"slug":2061,"type":13},{"name":2188,"slug":2189,"type":13},"React Native","react-native","2026-05-19T06:48:47.074181",{"slug":2030,"name":2030,"fn":2192,"description":2193,"org":2194,"tags":2195,"stars":26,"repoUrl":27,"updatedAt":2204},"implement advanced Next.js patterns with Clerk","Advanced Next.js patterns - middleware, Server Actions, caching with Clerk.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2196,2197,2198,2201],{"name":9,"slug":8,"type":13},{"name":21,"slug":22,"type":13},{"name":2199,"slug":2200,"type":13},"Next.js","next-js",{"name":2202,"slug":2203,"type":13},"Performance","performance","2026-04-10T05:00:15.80215",{"slug":2206,"name":2206,"fn":2207,"description":2208,"org":2209,"tags":2210,"stars":26,"repoUrl":27,"updatedAt":2218},"clerk-nuxt-patterns","implement Clerk auth in Nuxt 3 apps","Nuxt 3 auth patterns with @clerk\u002Fnuxt - middleware, composables, server API routes, SSR. Triggers on: Nuxt auth, useAuth composable, clerkMiddleware Nuxt, server API Clerk, Nuxt route protection.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2211,2212,2213,2214,2215],{"name":15,"slug":16,"type":13},{"name":2108,"slug":2109,"type":13},{"name":9,"slug":8,"type":13},{"name":21,"slug":22,"type":13},{"name":2216,"slug":2217,"type":13},"Nuxt","nuxt","2026-04-07T04:46:18.337538",{"slug":2041,"name":2041,"fn":2220,"description":2221,"org":2222,"tags":2223,"stars":26,"repoUrl":27,"updatedAt":2232},"manage Clerk Organizations for B2B SaaS","Clerk Organizations for B2B SaaS - create multi-tenant apps with org switching, role-based access, verified domains, and enterprise SSO. Use for team workspaces, RBAC, org-based routing, member management.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2224,2225,2228,2231],{"name":9,"slug":8,"type":13},{"name":2226,"slug":2227,"type":13},"Multi-Tenant","multi-tenant",{"name":2229,"slug":2230,"type":13},"RBAC","rbac",{"name":2128,"slug":2129,"type":13},"2026-04-10T05:00:14.40165",20,{"items":2235,"total":2233},[2236,2243,2250,2258,2266,2274,2282],{"slug":8,"name":8,"fn":2053,"description":2054,"org":2237,"tags":2238,"stars":26,"repoUrl":27,"updatedAt":2065},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2239,2240,2241,2242],{"name":15,"slug":16,"type":13},{"name":9,"slug":8,"type":13},{"name":2060,"slug":2061,"type":13},{"name":2063,"slug":2064,"type":13},{"slug":2067,"name":2067,"fn":2068,"description":2069,"org":2244,"tags":2245,"stars":26,"repoUrl":27,"updatedAt":2080},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2246,2247,2248,2249],{"name":2073,"slug":2074,"type":13},{"name":9,"slug":8,"type":13},{"name":2077,"slug":2078,"type":13},{"name":2060,"slug":2061,"type":13},{"slug":2082,"name":2082,"fn":2083,"description":2084,"org":2251,"tags":2252,"stars":26,"repoUrl":27,"updatedAt":2096},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2253,2254,2255,2256,2257],{"name":2088,"slug":2089,"type":13},{"name":15,"slug":16,"type":13},{"name":9,"slug":8,"type":13},{"name":21,"slug":22,"type":13},{"name":2094,"slug":2095,"type":13},{"slug":2098,"name":2098,"fn":2099,"description":2100,"org":2259,"tags":2260,"stars":26,"repoUrl":27,"updatedAt":2114},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2261,2262,2263,2264,2265],{"name":2104,"slug":2105,"type":13},{"name":15,"slug":16,"type":13},{"name":2108,"slug":2109,"type":13},{"name":9,"slug":8,"type":13},{"name":2112,"slug":2113,"type":13},{"slug":2116,"name":2116,"fn":2117,"description":2118,"org":2267,"tags":2268,"stars":26,"repoUrl":27,"updatedAt":2130},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2269,2270,2271,2272,2273],{"name":15,"slug":16,"type":13},{"name":9,"slug":8,"type":13},{"name":21,"slug":22,"type":13},{"name":2125,"slug":2126,"type":13},{"name":2128,"slug":2129,"type":13},{"slug":2132,"name":2132,"fn":2133,"description":2134,"org":2275,"tags":2276,"stars":26,"repoUrl":27,"updatedAt":2148},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2277,2278,2279,2280,2281],{"name":2138,"slug":2139,"type":13},{"name":9,"slug":8,"type":13},{"name":21,"slug":22,"type":13},{"name":2143,"slug":2144,"type":13},{"name":2146,"slug":2147,"type":13},{"slug":2150,"name":2150,"fn":2151,"description":2152,"org":2283,"tags":2284,"stars":26,"repoUrl":27,"updatedAt":2165},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[2285,2286,2287,2288,2289,2290],{"name":2104,"slug":2105,"type":13},{"name":15,"slug":16,"type":13},{"name":9,"slug":8,"type":13},{"name":2159,"slug":2160,"type":13},{"name":2162,"slug":2163,"type":13},{"name":2146,"slug":2147,"type":13}]