affect-kit
open-source web components for capturing how someone feels, and affectful, the feelings notebook built on them.
why i built it
Capturing how someone feels is usually either too blunt or too cumbersome: a 1 to 10 scale is too blunt to mean much, and clinical questionnaires are too long for a moment in someone's day. I wanted something in between, useful first to the person using it, and meaningful and insightful over time.
The science behind it, in short: feelings aren't a list of boxes. They sit in a space of how pleasant and how energized you feel (Russell's circumplex), so you place a face in that space first, because feeling comes before naming. Then you pick from 55 words, each placed in the same space by a peer-reviewed lexicon of 20,000. The face is built from facial movements that read the same across cultures, the colors follow research on how cultures pair color and emotion, and over time what matters is how your feelings move and recover, not a single score. It's a logbook, never a diagnosis.
what it is
Open-source web components: drag a face across a pad to set a gut feeling, then tap the words that fit. They work anywhere the web does.
Affectful is the reference app: a feelings notebook. Move a face until it looks right, find the words, and add a note about what's going on. Your check-ins stay on your phone.
It's also where I explore how the data could give something back without interpreting it for you. When you tap Done, Affectful reads your note for the parts of life it mentions, like sleep or weather, and suggests them as chips you can keep or take off. It never guesses your feelings: those are always the words you pick. The reading runs on your phone with a small model, and an opt-in labs switch adds Jev, TypeSafe's decision model, for the areas the phone reads less well, like family, friends and health.
The Words view then draws a thin line wherever a feeling and a part of life were logged together. No causes, scores or advice: just what showed up together.




how it's built
- typescript
- lit
- web components
- sveltekit
- indexeddb
- onnx runtime web
- jev (labs)
- cloudflare workers
The components are built with Lit, so they work in any framework or none. The face is drawn from code, blending smoothly between expressions as you move.
Affectful is a static SvelteKit app you can install on your phone. Check-ins live only on your device, with no account and no copy on a server, and notes are read right on the phone by a small model running in the browser.
- core to web components
- web components to npm: published
- web components to affectful: face · words
- affectful to your phone: stays here
what's next
keep building affectful as the reference implementation of affect-kit. it will always be free and local-first: your check-ins stay on your phone, and you own your data.