Building user interfaces for the web: A craft about UI components and design systems.
Hey there! 👋
My work is rooted in the frontend. Building user interfaces is something i follow for almost 10 years now. In that area, i found myself enjoying building components and creating the design system for them as the most fitting thing for me, in short:design system engineering.
One component can connect to the next, and the next, and the next, and all of a sudden we have a complete, streamlined, holistic and homogenous user interface that can be adjusted in color, size, spacing, typography and other theme-related properties from some root files.
Projectsshow you, in which teams i have participated yet
Quality woodworking tools and accessorizes for DIY projects
Toolshelp to visualize and communicate the application we build
I'm very familiar with:
- AI
- Go to external ChatGPT websiteChatGPT
A conversational AI system that listens, learns, and challenges.
Professional - Go to external Claude websiteClaude
Talk with Claude, an AI assistant from Antrophic
Used - Go to external v0 websitev0
Generate UI with shadcn/ui from simple text prompts and images
Professional
- Go to external ChatGPT website
- Analytics
- Go to external Google Analytics websiteGoogle Analytics
Measure your advertising ROI as well as track your Flash, video, and social networking sites and applications
Experienced - Go to external Google Tag Manager websiteGoogle Tag Manager
Google Tag Manager helps make tag management simple, easy and reliable
Used - Go to external Hotjar websiteHotjar
See how visitors are really using your website, collect user feedback and turn more visitors into customers
Used - Go to external Vercel Speed Insights websiteVercel Speed Insights
Real-time performance insights for your Vercel deployments
Experienced - Go to external Vercel Web Analytics websiteVercel Web Analytics
Privacy-friendly analytics for your Vercel projects
Experienced
- Go to external Google Analytics website
- Authentication
- Go to external Auth.js website
Auth.jsAuthentication for the Web. Free and open source.
Daily - Go to external Better Auth websiteBBetter Auth
The most comprehensive authentication framework for TypeScript.
Not started - Go to external Clerk websiteClerk
The easiest way to add authentication and user management to your application.
Not started
- Go to external Auth.js website
- Browser
- Go to external Arc websiteArc
A better way to browse
Used - Go to external Brave websiteBrave
Secure, fast & private web browser with adblocker
Not started - Go to external Chrome websiteChrome
A fast, secure, and free web browser built for the modern web
Daily - Go to external Firefox websiteFirefox
Firefox is more than a browser
Experienced - Go to external Safari websiteSafari
A faster, smarter way to browse the web
Daily
- Go to external Arc website
- Deployment + Hosting
- Go to external AWS Amplify websiteAWS Amplify
Build full-stack web and mobile apps in hours
Used - Go to external netlify websitenetlify
The fastest way to combine your favorite tools and APIs to build the fastest sites, stores, and apps for the web
Used - Go to external upsun websiteuupsun
The end-to-end cloud platform for building, running and scaling web applications
Used - Go to external Vercel websiteVercel
Develop. Preview. Ship. For the best frontend teams
Professional
- Go to external AWS Amplify website
- Design + Interface
- Go to external Adobe XD (deprecated) websiteAdobe XD (deprecated)
Design, prototype, and share user experiences
Professional - Go to external Canva websiteCanva
Create stunning visuals, from social media posts to presentations
Used - Go to external Figma websiteFigma
The collaborative interface design tool
Daily - Go to external Framer websiteFramer
Design and publish stunning sites
Used - Go to external Paper websitePaper
design incredible. for the love of design.
Used - Go to external Sketch websiteSketch
Design, prototype, collaborate and handoff
Experienced
- Go to external Adobe XD (deprecated) website
- Design Inspiration
- Go to external Dribbble websiteDDribbble
Discover the world's top designers & creatives
Used - Go to external Mobbin websiteMMobbin
Latest mobile design patterns
Used - Go to external Pinterest websitePPinterest
Discover recipes, home ideas, style inspiration and other ideas to try
Experienced - Go to external Toolfolio websiteTToolfolio
Discover new tools and resources for designers and developers
Not started
- Go to external Dribbble website
- Icons
- Go to external heroicons websiteheroicons
Beautiful hand-crafted SVG icons, by the makers of Tailwind CSS
Daily - Go to external luicide-react websiteluicide-react
Beautiful & consistent icon toolkit made by the community
Professional - Go to external Material Icons websiteMMaterial Icons
Material Design icons by Google
Used
- Go to external heroicons website
- IDE + Editor
- Go to external Cursor websiteCCursor
The AI-first code editor
Used - Go to external Sublime Text websiteSSublime Text
A sophisticated text editor for code, markup and prose
Used - Go to external Visual Studio Code websiteVisual Studio Code
The open source AI code editor
Professional - Go to external WebStorm websiteWebStorm
The JavaScript and TypeScript IDE
Daily - Go to external Windsurf websiteWWindsurf
Where developers are doing their best work
Used - Go to external zed websitezzed
Zed is a minimal code editor crafted for speed and collaboration with humans and AI.
Used
- Go to external Cursor website
- Motion + Animation
- Go to external jitter.video websitejjitter.video
Simple motion design tool
Not started - Go to external LottieFiles websiteLLottieFiles
Lightweight, scalable animations for your website and apps
Not started - Go to external Motion websiteMotion
A modern animation library for JavaScript and React
Daily - Go to external Procreate Dreams websitePProcreate Dreams
Animation made easy
Not started
- Go to external jitter.video website
- Package Manager
- Go to external bun websitebbun
Incredibly fast JavaScript runtime, bundler, test runner, and package manager – all in one
Not started - Go to external npm websitenpm
Build amazing things
Daily - Go to external pnpm websiteppnpm
Fast, disk space efficient package manager
Used - Go to external yarn websiteyyarn
Safe, stable, reproducible projects
Used
- Go to external bun website
- Packages
- Go to external @eslint/config website@eslint/config
Find and fix problems in your JavaScript code
Daily - Go to external @heroicons/react website@heroicons/react
Beautiful hand-crafted SVG icons for React
Daily - Go to external @meilisearch/instant-meilisearch website@meilisearch/instant-meilisearch
The search client to use Meilisearch with InstantSearch
Daily - Go to external @shopware/api-client website@shopware/api-client
Shopware API client for JavaScript/TypeScript
Daily - Go to external @shopware/api-gen website@shopware/api-gen
Generate TypeScript types from Shopware API
Professional - Go to external @storyblok/react website@storyblok/react
React SDK for Storyblok
Daily - Go to external @tanstack/* website@tanstack/*
High-quality, headless utilities for modern web development
Not started - Go to external @vercel/analytics website@vercel/analytics
Privacy-friendly analytics for Vercel deployments
Daily - Go to external @vercel/speed-insights website@vercel/speed-insights
Real-time performance insights for Vercel deployments
Daily - Go to external class-variance-authority websitecclass-variance-authority
Creating variants with the "cva" function
Experienced - Go to external clsx websitecclsx
A tiny utility for constructing className strings conditionally
Daily - Go to external eslint-plugin-tailwindcss websiteeslint-plugin-tailwindcss
ESLint plugin for Tailwind CSS usage
Daily - Go to external html-react-parser websitehtml-react-parser
HTML to React parser
Experienced - Go to external lucide-react websitelucide-react
Beautiful & consistent icon toolkit made by the community
Professional - Go to external next-view-transitions websitenext-view-transitions
Use CSS View Transitions API in Next.js App Router
Not started - Go to external prettier websitepprettier
Opinionated code formatter
Daily - Go to external prism-react-renderer websiteprism-react-renderer
Lightweight and flexible syntax highlighter for React
Used - Go to external react-hook-form websitereact-hook-form
Performant, flexible and extensible forms with easy validation
Professional - Go to external react-instantsearch websitereact-instantsearch
Lightning-fast search for React and React Native applications
Experienced - Go to external react-instantsearch-nextjs websitereact-instantsearch-nextjs
React InstantSearch for Next.js
Experienced - Go to external react-snowfall websitereact-snowfall
An awesome react component that creates snowfall
Daily - Go to external react-syntax-highlighter websitereact-syntax-highlighter
Syntax highlighting component for React
Used - Go to external storybook websitestorybook
Frontend workshop for UI development
Experienced - Go to external use-debounce websiteuuse-debounce
Debounce hook for React
Daily - Go to external zod websitezzod
TypeScript-first schema validation with static type inference
Daily
- Go to external @eslint/config website
- Payment
- Go to external Klarna websiteKKlarna
Smooth payments
Not started - Go to external PayOne websitePPayOne
Payment service provider
Not started - Go to external PayPal websitePPayPal
The safer, easier way to pay online
Used - Go to external Stripe websiteSStripe
Online payment processing for internet businesses
Not started
- Go to external Klarna website
- Photo + Graphics
- Go to external Adobe Illustrator websiteAdobe Illustrator
Create logos, icons, drawings, typography, and illustrations
Professional - Go to external Adobe InDesign websiteAAdobe InDesign
Design and publish great projects
Professional - Go to external Adobe Photoshop websiteAdobe Photoshop
Imaging and graphic design software
Experienced
- Go to external Adobe Illustrator website
- Project Management
- Research + Study + Data
- Go to external Baymard Institute websiteBBaymard Institute
UX research for e-commerce
Professional - Go to external Human Interface Guidelines (Apple) websiteHHuman Interface Guidelines (Apple)
Design principles and guidelines for Apple platforms
Experienced - Go to external NN/g Group websiteNNN/g Group
Nielsen Norman Group - UX research and consulting
Experienced - Go to external Statista websiteSStatista
Market and consumer data
Experienced
- Go to external Baymard Institute website
- Search
- Go to external Algolia websiteAlgolia
AI-Search, that understands
Experienced - Go to external Elastic Search websiteEElastic Search
Distributed, RESTful search and analytics engine
Not started - Go to external meilisearch websitemeilisearch
Lightning Fast, Ultra Relevant, and Typo-Tolerant Search Engine
Experienced
- Go to external Algolia website
- Shop System + Ecommerce
- Go to external Adobe Commerce (Magento) websiteAAdobe Commerce (Magento)
Flexible, scalable eCommerce solutions
Not started - Go to external Shopify websiteSShopify
Commerce platform for everyone
Not started - Go to external Shopware websiteShopware
The leading edge of ecommerce. Your business faster, limitless.
Daily
- Go to external Adobe Commerce (Magento) website
- Testing
- Go to external cypress websiteccypress
Browser testing for modern teams
Not started - Go to external Ghost Inspector websiteGGhost Inspector
Automated browser testing
Used - Go to external Jest websiteJJest
Delightful JavaScript Testing
Used - Go to external Playwright websitePPlaywright
Reliable end-to-end testing for modern web apps
Not started
- Go to external cypress website
- UI
- Go to external Base UI websiteBBase UI
Unstyled UI components for building accessible user interfaces
Used - Go to external Headless UI websiteHHeadless UI
Completely unstyled, fully accessible UI components
Experienced - Go to external Material UI websiteMMaterial UI
React components for faster and easier web development
Used - Go to external Practical UI websitePPractical UI
Practical UI components and patterns
Professional - Go to external Radix UI websiteRadix UI
Low-level UI primitives with a focus on accessibility
Experienced - Go to external Refactoring UI websiteRefactoring UI
Learn how to design awesome UIs by yourself using specific tactics explained from a developer's point-of-view
Daily - Go to external shadcn/ui websiteshadcn/ui
Beautifully designed components built with Radix UI and Tailwind CSS
Daily - Go to external Tailwind UI websiteTailwind UI
Beautiful UI components, crafted by the creators of Tailwind CSS
Experienced
- Go to external Base UI website
Technologiesare the foundation of writing production-ready code
I'm very familiar with:
- ReactReactas user interface web library
- Next.jsNext.jsas fullstack web framework
- TypeScriptTypeScriptas superset to JavaScript
- Tailwind CSSTailwind CSSas superset to CSS
- MotionMotionas animation library
- AnimationExperience level
- Build Tool
- Framework + Library
- Go to external Gatsby websiteGGatsbyNot started
- Go to external Nue.js websiteNNue.jsNot started
- Go to external React websiteReact
The library for web and native user interfaces
Daily - Go to external Svelte websiteSSvelte
Web development for the rest of us
Used - Go to external SwiftUI websiteSSwiftUIUsed
- Go to external Vue.js websiteVVue.jsUsed
- Go to external Gatsby website
- Full-Stack Framework
- Go to external Astro websiteAAstro
The web framework for content-driven websites
Not started - Go to external Next.js websiteNext.js
The React Framework for the Web
Daily - Go to external Nuxt.js websiteNNuxt.jsUsed
- Go to external React Router websiteReact Router
A user-obsessed, standards-focused, multi-strategy router you can deploy anywhere.
Used - Go to external Remix websiteRRemix
Focused on web standards and modern web app UX, you’re simply going to build better websites
Used
- Go to external Astro website
- Query Language




Social accountsYou can find my social presence on