system

The design system of this site, in public. Every specimen below is the real token or component, rendered live.

01 · tokens

  • background#0b0b0cground
  • foreground#e6e3deink · 15.37:1
  • card#131314panels
  • card-foreground#e6e3deink on panels
  • popover#131314popups
  • popover-foreground#e6e3deink on popups
  • primary#e6e3debone fill, selection
  • primary-foreground#0b0b0cink on bone
  • secondary#1c1c1dquiet buttons
  • secondary-foreground#e6e3deink on quiet buttons
  • muted#1c1c1dquiet fills
  • muted-foreground#8c8a86meta · 5.71:1
  • accent#1c1c1dhover fills
  • accent-foreground#e6e3deink on hover fills
  • destructive#ff3b30 · var(--signal)faults
  • signal#ff3b30primary action, fault · 5.55:1
  • signal-foreground#0b0b0cink on signal
  • warn#f5b400warnings
  • mark#5c5b58crop marks, list marks
  • border#2a2a2brules
  • input#6b6a66input edge · 3.63:1
  • ring#e6e3defocus ring

02 · type

display · martian mono · wdth 112.5 · wght 300Göksenin
body · geist mono · 16 px

The quick brown fox jumps over the lazy dog. 0123456789 ┌─┬─┐ │ ├─┼─┤ └─┴─┘

label · 11 px · caps · 0.08emls /writing · 05 posts
diagram · mermaid fence · box-drawing · 13 px
request flowdiagram

03 · components

primitives · src/components/ui

accordionui/accordion.tsx
multiple

Types once per session, then stops at the cursor.

3 Posts, 1 Project, 0 Experiments rebuilt.

single

Next.js App Router on Vercel. Every merged PR goes live.

alertui/alert.tsx
default
fault
with action
alert-dialogui/alert-dialog.tsx
aspect-ratioui/aspect-ratio.tsx
ratios
16:9
4:3
1:1
share image
Share image 1200×630
attachmentui/attachment.tsx
sizes
schema.tssize default
schema.tssize sm
schema.tssize xs
states
boring-pipelines.mdx12 KB
boot-log.mp4Uploading 64%
schema.tsProcessing
identity-card.pngUpload failed: over 10 MB
Drop a file.mdx .png .ts
vertical
share-image.png1200×630
index.mdx4 KB
cover.pngUploading 18%
avatarui/avatar.tsx
group
GGAKMR
+4
GGAK
+2
sizes
GGGGGGGG
with badge
GGGGGG
badgeui/badge.tsx
as link
writing/#etl
faults
Upload failedCommand failed
variants
PostProjectExperimentdraftrsslive
breadcrumbui/breadcrumb.tsx
collapsed
default
slash separator
bubbleui/bubble.tsx
conversation
ls writing/
boring-pipelines notes-on-ownership steps-easing
open boring-pipelines
writing/boring-pipelines · Last sync 2026-10-03
variants
default: bone fill
secondary
muted
tinted
outline
ghost: no fill, no padding
Not sent: connection lost. Retry?
with reactions
Shipped writing/boring-pipelines.
+2
Read it. The retry section is good.
ok
buttonui/button.tsx
as link
Open /writing
disabled
sizes
variants
with icon
button-groupui/button-group.tsx
default
vertical
with text
~/writing
https://
goksen.ing/writing
calendarui/calendar.tsx
dropdowns
October 2026
40
41
42
43
44
range
September 2026
October 2026
single
October 2026
cardui/card.tsx
default
Boring pipelines
writing/boring-pipelines · 2026-10-03
Post
Why the dullest ETL design is the one that still runs at 03:00.
small
retry-queue
work/retry-queue
Project
A small job queue that retries with backoff.
steps-easing
lab/steps-easing · Last sync 2026-10-03
chartui/chart.tsx
bars
Entries shipped / month
with tooltip
Build time / day
checkboxui/checkbox.tsx
disabled
states
collapsibleui/collapsible.tsx
closed
Changelog / v0.4
Command line opens as a dialog
expanded
Changelog / v0.4
Command line opens as a dialog
Boot log types once per session
Corners stay square everywhere
comboboxui/combobox.tsx
default
multiple
commandui/command.tsx
inline
> waiting for a Command
no match
context-menuui/context-menu.tsx
Right-click the Post
dialogui/dialog.tsx
directionui/direction.tsx
ltr
rtl
drawerui/drawer.tsx
dropdown-menuui/dropdown-menu.tsx
emptyui/empty.tsx
no results
No Entry matches “rust”
Try another tag, or open the Lab.
with icon
No Posts yet
The first Post ships at launch. Subscribe to read it first.
fieldui/field.tsx
choices
Notify me about
fault
form
Contact

Replies go out within two days.

Plain text. No attachments.

or
hover-cardui/hover-card.tsx

The long version is in writing/boring-pipelines. Hover the link to see its Summary.

inputui/input.tsx
default
file
states

Subscribe failed: the address has no domain.

input-groupui/input-group.tsx
addons
>
⌘K
https://
3 results
with textarea
to: [email protected]
0 / 500
input-otpui/input-otp.tsx
controlled
2
0
4
6
2 left
default
disabled
itemui/item.tsx
group
Post2026-09-14
Boring pipelines

Why the pipelines that never page anyone are built from plain parts.

6 min read#data
Experiment2026-08-02
Particle field

Ten thousand points that follow the cursor. Needs WebGL.

Runs live#webgl
sizes
default

writing/boring-pipelines

sm

writing/cron-is-a-database

xs

writing/notes-on-retries

variants
writing/boring-pipelines

Why the pipelines that never page anyone are built from plain parts.

work/tiny-etl

A 400-line ETL runner that reads YAML and writes Parquet.

lab/particle-field

Ten thousand points that follow the cursor. Needs WebGL.

kbdui/kbd.tsx
in text

Press ⌘K to open the Command line, ↵ to run, Esc to close.

keys
⌘KEsc↵Tab⌘⇧PCtrl+K
labelui/label.tsx
disabled
with input
markerui/marker.tsx
variants
Last sync 2026-10-03 09:41
2026
writing/ · 12 posts
with link
Edited 2026-09-30 · changelog
All posts in /writing
menubarui/menubar.tsx
messageui/message.tsx
group
build
$ pnpm build
✓ 41 routes compiled
✓ Deployed to preview
Last sync 2026-10-03
thread
visitor
What runs in /lab right now?
09:41
gg
goksen.ing
Two Experiments: particle-field and game-of-life. Both show a Fallback when WebGL is off.
09:41 · 2 entries
message-scrollerui/message-scroller.tsx
auto scroll
help
Commands: writing, work, lab, about, clear.
writing
12 posts. Newest: boring-pipelines (2026-09-14).
thread
help
Commands: writing, work, lab, about, clear.
writing
12 posts. Newest: boring-pipelines (2026-09-14).
work
4 projects. Newest: tiny-etl.
lab
2 experiments. particle-field runs live.
about
Engineer. Writes about boring systems.
native-selectui/native-select.tsx
disabled
grouped
sizes
navigation-menuui/navigation-menu.tsx
paginationui/pagination.tsx
default
newer older
popoverui/popover.tsx
progressui/progress.tsx
custom value
Boot log
x
default
Building /writing
x
Fonts loaded
x
questionnaireui/questionnaire.tsx
default
What should the next Posts cover?

Pick any.

fault
Which section brings you here?

Pick one. The Index lists it first.

last item
Anything else?
radio-groupui/radio-group.tsx
default
disabled
resizableui/resizable.tsx
horizontal
Index
Post
vertical
Experiment
Boot log
scroll-areaui/scroll-area.tsx
horizontal
vertical
selectui/select.tsx
separatorui/separator.tsx
horizontal
Göksenin GüngörWriting, Work, and Lab in one terminal.
Last build 2026-10-03
vertical
sheetui/sheet.tsx
sidebarui/sidebar.tsx
Sections
goksen.ing
Writing

12 Posts. Latest: Terminal type at 11 px.

skeletonui/skeleton.tsx
entry
index rows
sliderui/slider.tsx
default
Reading width66ch
range
Published2021 to 2026
sonnerui/sonner.tsx
default
fault
spinnerui/spinner.tsx
in button
sizes
Building /writing
switchui/switch.tsx
default
sizes
tableui/table.tsx
3 of 19 Entries
EntrySectionDateRead
Terminal type at 11 pxWriting2026-09-286 min
goksen.ingWork2026-09-254 min
Boot logLab2026-09-30live
Total reading time10 min
tabsui/tabs.tsx
default
12 Posts. Latest: Terminal type at 11 px.
line
12 Posts. Latest: Terminal type at 11 px.
textareaui/textarea.tsx
default
fault

The reply did not send. Check the connection and retry.

toastui/toast.tsx
default
fault
toggleui/toggle.tsx
sizes
variants
toggle-groupui/toggle-group.tsx
default
outline
tooltipui/tooltip.tsx

parts · src/components/system

contentssystem/contents.tsx
default
no headings
factssystem/facts.tsx
column
whoami
role
Lead engineer.
now
Rebuilding this site in public.
mail
[email protected]
strip
published
2026-09-28
updated
2026-10-02
read
08 min
stack
TypeScript
fault-panelsystem/fault-panel.tsx
fault · 404/nope

no such path

cd: no such path: /nope

trycd ~ — the Index
panelsystem/panel.tsx
default
whoami

Lead engineer. Data platforms and backend systems.

with right
ls /writing5 posts
  • In praise of boring pipelines
  • Rebuilding goksen.ing in public
path-barsystem/path-bar.tsx
default
⌘K
plain

compositions · src/components/compositions

command-linecompositions/command-line/command-line.tsx
dialog
command lineesc
inline
ready.
providercompositions/command-line/provider.tsx

One provider wraps every page from the layout: ⌘K or Ctrl+K opens its dialog here, and on the Index focuses the inline Command line.

triggercompositions/command-line/trigger.tsx
entry-footercompositions/entry-footer.tsx
both neighbours
default
entry-headercompositions/entry-header.tsx
default
writing / post

In praise of boring pipelines

Why the data platform that wins is the one nobody pages about.

published
2026-09-28
updated
2026-10-01
reading
08 min
with cover
work / project

In praise of boring pipelines

Why the data platform that wins is the one nobody pages about.

published
2026-09-28
updated
2026-10-01
reading
08 min
experiment-framecompositions/experiment-frame.tsx
lab / experiment

Dissolve

Characters settling into place in random order.

published
2026-09-30
status
stable
stack
CSS · TypeScript
livestable
notes

Each character waits a random slot inside 300 ms, then lands. Reduced motion shows the settled line.

experiment-livecompositions/experiment-live.tsx
fault-pagecompositions/fault-page.tsx
broken
fault · 500

something broke

error: 3816430427

try

not found
fault · 404/nope

no such path

cd: no such path: /nope

try

screen
fault · 404/nope

no such path

cd: no such path: /nope

try

identity-cardcompositions/identity-card.tsx
identity card/ — index

Göksenin Güngör

role
Lead engineer. Data platforms and backend systems.
now
Rebuilding this site in public.
mail
[email protected]
links
github ↗linkedin ↗

04 · motion

glitchlinks, on hover and focus
dissolvethe page title
boot logthe Index, once a session
cursorthe prompt: 5 blinks, again on focus
hard cuta Fault
aftershockthe 404 and error pages