# Updated: Card Nav

By Steven Van · 2026-10-13

The React Bits navigation component gains hover-to-open, a stacked small-screen layout and a light mode, in JavaScript or TypeScript with CSS or Tailwind.

Card Nav has been rebuilt in [React Bits](<https://creatorstoolbox.com/resources/react-bits>). The [updated component](<https://reactbits.dev/components/card-nav>) is a navigation bar that springs open into a row of cards, each with its own links.

## What changed

- A springy open animation.

- Cards that rise, unfold or fade in.

- Link arrows that slide.

- Opening on hover.

- A stacked layout for small screens.

- A light mode.

## Installing it

The component is available in JavaScript or TypeScript, with plain CSS or Tailwind. The TypeScript and Tailwind version installs with npx shadcn@latest add @react-bits/CardNav-TS-TW.

![React Bits](<https://reactbits.dev/favicon.ico>)

React Bits

An open-source collection of 200+ animated, interactive React components and micro-interactions.

[View React Bits →](<https://creatorstoolbox.com/resources/react-bits>)

Sources

[Original source](<https://reactbits.dev/components/card-nav>)

[Read Updated: Card Nav on Creators Toolbox](<https://creatorstoolbox.com/blog/react-bits-updated-card-nav>)

---
Canonical source: https://creatorstoolbox.com/blog/react-bits-updated-card-nav