# \[Plugin\] Sticky Scroll for CodeMirror 6 — VS Code / Monaco-style pinned scope lines
**URL:** https://discuss.codemirror.net/t/plugin-sticky-scroll-for-codemirror-6-vs-code-monaco-style-pinned-scope-lines/9860
**Category:** v6
**Created:** [August 11, 2026, 5:50pm UTC](https://discuss.codemirror.net/t/plugin-sticky-scroll-for-codemirror-6-vs-code-monaco-style-pinned-scope-lines/9860 "2026-08-11T17:50:20Z")
**Posts on this page:** 2
**Page:** 1
### Author:  [@fazelllyyy](https://discuss.codemirror.net/u/fazelllyyy)
#### Post date: [August 11, 2026, 5:50pm UTC](https://discuss.codemirror.net/t/plugin-sticky-scroll-for-codemirror-6-vs-code-monaco-style-pinned-scope-lines/9860/1 "2026-08-11T17:50:20Z")
Hi everyone! 👋
I’ve just published a new extension that brings VS Code / Monaco-style **sticky scroll** to CodeMirror 6:
📦 **@fazelstudio/codemirror-stickyscroll**
- GitHub: [GitHub - fazelllyyy/codemirror-stickyscroll: VS Code / Monaco-style sticky scroll (sticky lines) extension for CodeMirror 6 · GitHub](https://github.com/fazelllyyy/codemirror-stickyscroll)
- npm: [https://www.npmjs.com/package/@fazelstudio/codemirror-stickyscroll](https://www.npmjs.com/package/@fazelstudio/codemirror-stickyscroll)
* * *
### What it does
Sticky lines keep the _opening_ lines of the enclosing scopes (function, class, if/loop, etc.) pinned at the top of the editor as you scroll — exactly like VS Code’s sticky scroll, but built as a **pure external extension** (no fork of any `@codemirror/*` package).
* * *
### Features
- **Per-pixel updates** via native `scroll` + `requestAnimationFrame` — no jumpy redraws
- **Slide-away effect** — the innermost row slides up smoothly as its scope’s closing line approaches the viewport (matches Monaco’s exact behavior)
- **Click-to-jump** with scroll margin compensation so the target line is never hidden behind the bar
- **Reuses the consumer’s theme** — token colors come from the active `highlightingFor()` highlighters; the package never registers its own `syntaxHighlighting`
- **Language-agnostic** — works with any `@codemirror/lang-*` that registers `foldNodeProp`, with a built-in smart denylist for JS/TS, Python, Rust, Go, and graceful JSON support
- **Gutter alignment** — line numbers mirror the real gutter column-by-column via `ResizeObserver`
- **Dynamic height clamping** — the bar never covers more than ~40% of the viewport
- **Zero runtime deps** — peer dependencies only
* * *
### Usage
```ts
import { stickyScroll } from "@fazelstudio/codemirror-stickyscroll";
new EditorView({
extensions: [
basicSetup,
javascript(),
stickyScroll({ maxStickyLines: 4 }),
],
parent: document.body,
});
──────
Any feedback, bug reports, or suggestions are very welcome! 🙏
```
---
### Author:  [@marijn](https://discuss.codemirror.net/u/marijn)
#### Post date: [August 11, 2026, 6:41pm UTC](https://discuss.codemirror.net/t/plugin-sticky-scroll-for-codemirror-6-vs-code-monaco-style-pinned-scope-lines/9860/2 "2026-08-11T18:41:32Z")
Neat! Thanks for sharing. I’ve added it to the [community extension list](https://codemirror.net/docs/community/#extensions).