---
url: "https://vueda.dev/v3/reference/api/vue/StickyChrome.md"
title: "StickyChrome"
---

# StickyChrome

## Overview

Teleports a view's sticky chrome into one of the `StickyStackProvider` zones (`top` or `bottom`)
and registers the reveal behavior that zone should adopt while this chrome is mounted (see
`useStickyStack`). When no provider zone exists above, the chrome renders inline where this
component is placed, so a view degrades gracefully if the layout omits the provider.

## Props

| Name | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| <span id="prop-zone">zone</span> | `string` |  | `"top"` | Which provider zone to teleport into. Fixed at mount; changing it later does not move the bar. |
| <span id="prop-order">order</span> | `number` |  | `0` | Sort order of this bar within its zone's stack (ascending, top to bottom). Reactive: changing it re-sorts the stack. |
| <span id="prop-reveal">reveal</span> | `import('vue').PropType<import('@vueda/use/useScrollReveal.js').ScrollRevealStrategy \| boolean>` |  | `undefined` | This bar's reveal behavior: a strategy string (`always`, `scroll-up`, `scroll-up-or-idle`) or a boolean (revealed when `true`). When omitted, the bar stays visible (`always`). |

## Slots

### `default` {#slot-default}

Slot.

## Source

`client/lib/shell/sticky/StickyChrome.vue`