diff --git a/docs/guides/customizing-clerk/appearance-prop/options.mdx b/docs/guides/customizing-clerk/appearance-prop/options.mdx index a6b23a12e9..78ba244260 100644 --- a/docs/guides/customizing-clerk/appearance-prop/options.mdx +++ b/docs/guides/customizing-clerk/appearance-prop/options.mdx @@ -6,7 +6,7 @@ sdk: astro, chrome-extension, expo, nextjs, nuxt, react, react-router, tanstack- {/* JS file: https://github.com/clerk/javascript/blob/main/packages/types/src/appearance.ts#L538 */} -The `options` property can be used to change the layout of the [``](/docs/reference/components/authentication/sign-in) and [``](/docs/reference/components/authentication/sign-up) components, as well as set important links to your support, terms, and privacy pages. +The `options` property can be used to change the layout and behavior of Clerk's prebuilt components, as well as set important links to your support, terms, and privacy pages. ## Properties @@ -18,6 +18,13 @@ The `options` property can be used to change the layout of the [``](/do --- + - `elevation` + - `'raised' | 'flush'` + + Controls the visual elevation of card-based components. `'raised'` renders the card with its border, box-shadow, border-radius, and padding. `'flush'` removes the card border, box-shadow, border-radius, outer padding, and footer background so the component sits flat against its container. Applies to page-mounted card-based components such as [``](/docs/reference/components/authentication/sign-in), [``](/docs/reference/components/authentication/sign-up), [``](/docs/reference/components/authentication/waitlist), [``](/docs/reference/components/organization/create-organization), and [``](/docs/reference/components/organization/organization-list). Does not affect profile components ([``](/docs/reference/components/user/user-profile), [``](/docs/reference/components/organization/organization-profile)) or popover components ([``](/docs/reference/components/user/user-button), [``](/docs/reference/components/organization/organization-switcher)), which always render as raised. When a component is opened as a modal, it always renders as raised regardless of this setting. Defaults to `'raised'`. + + --- + - `helpPageUrl` - `string`