notes.

Tiny Astro site that turns a folder of files into your personal notes storage. Inspired by type. Get started →

How it works

Drop a file, get a page

No config, no database, no admin panel. Put a .md .mdx .astro or .html file into src/pages/ — and it's published. That's it. That's the whole workflow.

Folders are pages too

Nest your notes however your brain likes. Every folder becomes a navigable listing, generated automatically. Two notes or two hundred — the structure just follows you.

src/pages/
├── films/
│   ├── blade-runner.md
│   ├── 2001.mdx
│   └── directors/
│       └── lynch.md
└── personal/
    ├── setup.md
    └── notes/
        └── coffee.astro

Any content you like

Markdown and MDX are styled automatically, zero extra steps. Astro pages get the same look — just wrap them in NoteLayout:

---
import NoteLayout from '@layouts/NoteLayout.astro'
---
<NoteLayout>your content</NoteLayout>

HTML pages are listed and served as-is, no styling applied.

Frameworks included

Components run right inside notes:

1. Drop a .tsx .vue .svelte or astro file into src/components/
2. Import and use it in any .mdx or .astro note
3. Add client:load directive for interactive components

import Counter from '@components/Counter'

# I can only count to four!
<Counter client:load />

How it feels

Hands on keyboard

Browse like it's a file manager. Arrow keys move between entries, Backspace takes you back. Mouse is optional, honestly.

Find anything

Fuzzy-search every note across the whole site — from any folder.

Pick the right style

Switch fonts (serif / mono / sans) and themes (light / dark / digital) to find the look that feels like home. Your choice is remembered.

Build your own notes

Get started

1. Install Node (cause you need npm)
2. Use this repo as a template and download it
3. Open terminal and run this

cd <path to folder of notes.>
npm i
npm run dev

4. Open link from terminal (usually http://localhost:4321/)

That's it. Replace src/pages content with your own notes and you are ready to deploy.

Keep one file, though: src/pages/[...folder].astro is what generates every folder listing. Swap your notes in around it — delete it and the navigation goes with it.

Make it yours

Completely optional configuration lives in one file — notes.settings.jsonc in the project root.

Setting	What it does
rootTitle	The main heading on the root page of your site
title	Your site's name — the browser tab and the title suffix
description	Default page description, for meta tags and link previews
appearance	Starting theme / font and whether their switcher buttons show
indexable	false tags every page noindex so search engines skip it — flip to true to go public
footer	Show / hide the footer and set its links

One privacy caveat: indexable only hides you from search — everything in src/pages/ is still served to anyone who has the link. Keep truly private things locally.

If you want to edit styles, welcome to src/styles/. Folder page logic lives in src/pages/[...folder].astro.

---

Designed and developed by qurle. Inspired by type.baby.

Share bugs and ideas via issues. Any dialogs are also welcome at nick@qurle.net.