A portfolio
The site embraces
Key principles:
- High contrast: bold black-on-white backgrounds with stark typographic hierarchy for maximum readability.
- Minimal ornamentation: every element earns its place; no decorative fluff.
- Typographic focus:
Cascadia Monofor headings (h1–h2) for a bold, monospaced statement;Space Groteskfor body text and subheadings;Mechsuitfor the logo. Clean, geometric, and assertive. - Deliberate spacing: generous whitespace guides the eye and lets content breathe.
- Consistent rhythm: a fixed set of spacing and sizing tokens keeps the layout grounded.
- Scroll-triggered reveals: elements animate into view as you scroll, adding motion without clutter.
- Dark mode: full theme support that inverts the palette while preserving contrast ratios.
The result is a portfolio that feels honest, direct, and memorable, much like the work it showcases.
- Runtime: Bun
- Framework: SvelteKit (static adapter, prerendered SPA)
- Styling: Tailwind CSS
- Icons: Iconify via
@iconify/svelte, FontAwesome viasvelte-fa - Fonts:
@fontsource/cascadia-mono(headings),@fontsource/space-grotesk(body),Mechsuit(custom, navbar logo) - Languages: TypeScript, JavaScript
bun install # install dependencies
bun run dev # start dev server
bun run build # production build to build/
bun run check # type-check with svelte-check
bun run lint # lint & format check
bun run format # auto-format with PrettierContributions, issues, and pull requests are welcome.
Ikhsan Satriadi: @ikhsan3adi