## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES
## What kind of change does this PR introduce?
Feature — the visual redesign itself.
Part 5 of 6 in a stack that splits the library redesign into reviewable
pieces. The four PRs beneath it carry the build, content and Markdown
work; what's left here is layout, navigation and styling.
## What is the current behavior?
The library is laid out like a documentation site: a sidebar tree of
framework folders, a homepage that lists links, and a guide page that
opens with prose. That shape suits reference material, but the library's
job is to help someone find a block and install it — and the sidebar is
the only way to discover one.
## What is the new behavior?
The homepage is the catalog itself — blocks grouped by what they do
(authentication, database, storage, realtime, messaging, AI,
foundations) rather than by framework, each with a preview of what it
renders, filterable by category.
Navigation moves into a site header whose Explore menu opens the same
categories, so the catalog is reachable from any page and the per-page
sidebar tree is gone.
A guide opens with what the reader came for: the block's name, the
install command, and a preview pane with tabs — the running component
and its files — before any prose. The file tree that used to sit
mid-page under "Folder structure" is one of those tabs. Every guide also
offers a copy of the agent prompt that points at its Markdown.
Getting-started pages get the same treatment: the quickstart is now a
framework-tabbed walkthrough rather than a wall of setup links.
## Additional context
`BlockOverviewTabs` renders Preview and Files here. #50369, stacked on
top of this one, adds the third "What's added" tab — it is the only part
of the redesign that depends on the new resource analyzer, which is why
it sits above this PR rather than below it.
Also removes what the redesign orphaned: the table-of-contents component
and its `remark` / `mdast-util-toc` dependencies, and the sidebar nav
and command-item configuration the new header replaced.
The block source changes are typography only — auth card titles move
from `text-2xl` to `font-medium text-lg tracking-normal` — which is what
regenerates the auth registry artifacts.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a redesigned Supabase Library catalog with categorized blocks,
framework-aware navigation, previews, file views, and installation
actions.
* Added framework-specific quickstart guides for Next.js, React, Vue,
Nuxt, React Router, and TanStack Start.
* Added copy-to-clipboard prompts, “Open in v0” actions, starter
templates, and richer visual previews.
* **Improvements**
* Updated documentation layouts, FAQ content, typography, navigation,
accessibility, and responsive behavior.
* Improved mobile navigation, framework selection, and standardized
block installation guidance.
* Refined authentication and social-login block presentation with more
consistent heading styles.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Opus 5 <noreply@anthropic.com>
Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES/NO
## What kind of change does this PR introduce?
Bug fix, feature, docs update, ...
## What is the current behavior?
Please link any relevant issues here.
## What is the new behavior?
Feel free to include screenshots if it includes visual changes.
## Additional context
Add any other context or screenshots.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Refreshed theming across the UI to use modern color expressions and
shared theme variables (including OKLCH-based gradients), improving
consistency for charts, code blocks, overlays, icons, and decorative
backgrounds.
* **Bug Fixes**
* Improved light/dark color and gradient consistency across axis/grid
styling, reference lines, buttons/badges, sidebar accents, loaders, and
other visual components.
* **Documentation**
* Updated styling/theming guidance to align with the revised semantic
token system and the updated theme variable usage patterns.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.
---------
Co-authored-by: Jordi Enric <jordi.err@gmail.com>
Sorted all imports in all packages, `cms`, `design-system` and
`ui-library` apps by running `pnpm format` on them.
All changes in this PR are done by the script.
* Remove unneeded code.
* Remove more unused code.
* Update knip.jsonc for ui-library.
* Remove unneeded imports. Change the registry generation to only generate what's needed.
* Cleanup the rehype middleware (it wasn't used). Clean up the example blocks generation.
* Don't show the "show code" button in all dropzone examples.
* Fix the v0 button. Add some more docs. (+13 squashed commits)
Squashed commits:
[cc5954779e] Add success state to the forgot-password form.
[258bfb1015] Simplify the tanstack auth block.
[1ba5c223d9] Add missing pages to the nextjs auth.
[b842e4acec] Fix the env vars in the React client.
[2a2bcc5356] Fix the command URL.
[a26a2d36c2] Add a tanstack block for password-based auth.
[d68881f0d5] Fix the tanstack client.
[1fd2e16d96] Add missing deps to satisfy TS build.
[9797d745df] Various fixes.
[3e9b676e99] Fix the registryBlock component.
[540a5d600b] Set the supabase project for testing.
[3eba892c92] Regenerate the llms.txt file.
[bf526a0ecb] Regenerate the registry files.
* Add current user avatar.
* Add RealtimeAvatarStack.
* Use the fields which are populated by Auth.
* Regenerate the registry files.
* Fix the imports.
* Rebuild the registry files. Add a github login to the supabase config.
* Minor fixes for the components.
* Minor fix to the avatar stack.
* Remove peekCode, show showCode prop to component preview.
* Add examples for avatar stack and current user avatar.
* Use the new generatenames function in the cursors.
* Add documentation for avatar stack and avatar.
* Switch the profile images.
* Fix a type error.
* More fixes.
* init
* Update component-preview.tsx
* please note: changed redirects in block, so need to update the logic to find and replace the redirects
* Fix the redirect urls to work when installing and in examples.
* Revert some of the changes.
* Add a step when building the registry to clean the registry of example code.
* Fix the clean registry script.
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* Copy the design-system app into a new one for ui-library.
* Remove unneeded content.
* Add supabase config.
* Cleanup the css.
* Add bunch of packages.
* Cleanup the registry.
* Regenerate the registry.
* Add needed components for documenting components.
* Add the pages for the components.
* Fix the RegistryBlock.
* Various fixes.
* Add a turbo definition for ui-library.
* Rename Remix to React Router.
* Reorder the pages for all frameworks.
* Remove the bottom pager.
* Fix the pages and command menu.
* Various fixes.
* Minor fixes.
* Add ai editor rules.
* Various fixes.
* Add local supabase env vars.
* Try to fix a package error.
* Bunch of various fixes.
* Fix lint errors.
