Tabsnail 🐌

This project is a work in progress to bring Fiona's brilliant idea to life: display your web browser's tab bar in a snail-like layout around the page.

• 🐌 Navigate between your tabs using an intuitive snail-layout
• 😵‍💫 Feel naturally discouraged from tab hoarding as the snail grows
• 💅 Pick your favorite snail color theme
• ⚙️ Customize colors and the tab bar size
• 🤓 The viewport automatically adjusts to fit inside the snail

Currently, Chrome and Firefox are supported. Because it is not published yet, you need to build and install the extension yourself if you want to use it (see development).

Roadmap

• Migrate to WXT for cross-browser support
• Use Svelte for rendering (in progress)
• Show all tabs in snail form
• Navigation
• Close tabs
• Shrink viewport to inner snail bounds
• Update layout on viewport changes
• Configurable tab size
• Tab groups
• Themes inspiration
  • Striped (default) with color setting
  • Pride
  • Windows 95
  • Leopard Slug
  • Pacific Banana Slug
  • Red Slug
  • Sea Slug
  • Carpathian Blue Slug
  • Yellow Slug?

Development

This project uses WXT. To start the extension in development mode, run one of the following commands. The extension will launch in an isolated Chrome or Firefox window (Chrome by default) and automatically reload on changes.

pnpm dev # each command uses Chrome by default
pnpm dev:chrome
pnpm dev:firefox

Alternatively, you can install the extension in your browser manually by loading the respective directory in ./build as an unpacked extension.

Other helpful commands:

pnpm check # checks all things below
pnpm format
pnpm lint
pnpm tsc

Tests will be added soon.

Publishing

To build in production mode, run:

pnpm build
pnpm build:chrome
pnpm build:firefox

You can create zip files with:

pnpm zip
pnpm zip:chrome
pnpm zip:firefox

Licensed under the Non-White-Heterosexual-Male License.