The Ultimate Resource
for Design Engineers.

Browse Resources:

• Design Systems Surf • Best-in-class Design Systems collection with a repository of Components and Foundations references from top-tier tech companies and leading UI teams.

  May 16, 26

• @web-kits/audio • Declarative audio synthesis for the web.

  May 16, 26

• Gradient Border Plugin • A simple Tailwind CSS plugin for beautiful gradient borders using mask-composite. Mirrors Tailwind's gradient utilities with from / via / to color stops, configurable widths, and an animated variant.

  May 15, 26

• Front-of-the-front-end and back-of-the-front-end web development

  May 15, 26

• Taste Skill • Taste Skill gives your AI coding agent good taste. Open-source skill files that stop Cursor, Claude Code, Codex & more from generating generic, boring frontends. Install in one command.

  May 14, 26

• The Concept of Taste • An exploration of aesthetic taste in art, design, and creative fields.

  May 13, 26

• Design for Engineers • Design and code work hand-in-hand to produce memorable digital products.

  May 13, 26

• Jakub Krehel • Founding Design Engineer at Interfere

  May 13, 26

• Interfaces • Design Engineering Magazine

  May 13, 26

• Hashvatar • Generate deterministic, unique avatars from wallet addresses, usernames, or any string. Zero dependencies. Gradient & dither modes. React & vanilla JS.

  May 13, 26

• Remediate • Capture screenshots, video, voice notes, and annotations from users as in-app feedback. One React component, one server helper. Routes to Slack, Linear, GitHub, email, or webhooks. MIT licensed.

  May 04, 26

• Transitions.dev • Collection of the most essential transitions for web apps that you can just copy and paste into any project.

  May 02, 26

• devl.dev • Two years of UI experiments. 159+ components built on coss-ui, all on the shadcn registry.

  Apr 27, 26

• ui.land • The Digital Library for Designers and Engineers.

  Apr 16, 26

• Using AI as a Design Engineer • How I use AI as a design engineer on a daily basis.

  Apr 05, 26

• Torph • Dependency-free animated text component.

  Apr 03, 26

• shadowLab • A playground for creating box shadows for web and React Native.

  Mar 27, 26

• UI Skills • A set of skills to polish interfaces built by agents.

  Mar 24, 26

• A Collection of Design Engineers • Collecting people I know who work at the intersection of design and engineering, in an attempt to figure out what a design engineer is

  Mar 24, 26

• rams • Automated design reviews for AI-generated code. Catches accessibility issues and visual bugs in React, Vue, Svelte, and more.

  Mar 21, 26

• Design Principles • A curated collection of design principles used as decision-making frameworks. Practical examples and guidance for teams building products.

  Mar 18, 26

• Fancy Components • Ready to use, fancy React components to make the web fun again. Free & Open Source.

  Mar 18, 26

• Design System Checklist • An open-source checklist to help you plan, build and grow your design system.

  Mar 17, 26

• Laws of UX • Laws of UX is a collection of best practices that designers can consider when building user interfaces.

  Mar 17, 26

• Impeccable • 1 skill, 20 commands, and curated anti-patterns for impeccable frontend design. Works with Cursor, Claude Code, Gemini CLI, and Codex CLI.

  Mar 17, 26

• DialKit • A floating control panel for React: sliders, toggles, color pickers, spring editors, and action buttons wired directly to your UI values.

  Mar 17, 26

• Details That Make Interfaces Feel Better • A collection of details that make your interfaces feel better.

  Mar 16, 26

• Calligraph • Fluid text transitions powered by Motion

  Mar 16, 26

• The Attributes of a Design Engineer • My definition of design engineering after building the practice at DoorDash.

  Mar 16, 26

• Easing Graphs • A curated collection of easing graphs

  Mar 15, 26

• floguo • Founding design engineer at Paradigm

  Mar 15, 26

• Design Engineering • Links and observations on design engineering

  Mar 15, 26

• Becoming a Design Engineer • Thoughts about design, code, technology and everything in between.

  Mar 15, 26

• Design Engineering • Learn what Design Engineers do, why they matter to modern tech companies, and how they differ from vibe coders.

  Mar 15, 26

• Design Engineer Tools • A list of useful tools for web-focused design engineers.

  Mar 14, 26

• userinterface.wiki • A living manual for better interfaces. Learn design principles, motion, typography, and more.

  Mar 14, 26

• OKLCH.fyi • Convert, generate and explore OKLCH colors – a powerful tool to build unique and uniform color palettes.

  Mar 11, 26

• The Component Gallery • An up-to-date repository of interface components based on examples from the world of design systems, designed to be a reference for anyone building user interfaces.

  Mar 10, 26

• Interface Craft • A working library for those committed to designing with uncommon care.

  Mar 10, 26

• Invisible Details of Interaction Design • What makes great interactions feel right?

  Mar 10, 26

• Interactive SVG Animations • An interactive mini-course on creating SVG animations by Nanda Syahrasyad.

  Mar 10, 26

• Liveline • Real-time animated line chart for React.

  Mar 09, 26

• Family Values • What makes Family, Family.

  Mar 09, 26

• Devouring Details • An interactive reference manual for interaction-curious designers.

  Mar 09, 26

• UI Playbook • The documented collection of UI components.

  Mar 09, 26

• ⌘K • Fast, unstyled command menu React component.

  Mar 09, 26

• Web Interface Guidelines • A non-exhaustive list of details that make a good web interface.

  Mar 09, 26

• Design Engineer Jobs • Find a design engineering job in a next generation software company.

  Mar 08, 26

• soundcn • 700+ curated UI sound effects for modern web apps.

  Mar 08, 26

• Design Engineering: A State of Mind • Finding my dream role blending code, design, and product thinking

  Mar 08, 26

• Design Engineering Club • Design Engineering Community

  Mar 08, 26

• WebHaptics • Haptic feedback for the mobile web.

  Mar 07, 26

• Design Engineering 101 • Practical guide to the jobs and skills of the design engineer in tech

  Mar 07, 26

• Rauno Freiberg • Staff Design Engineer at Vercel

  Mar 07, 26

• Sonner • An opinionated toast component for React.

  Mar 06, 26

• Emil Kowalski • Design engineer working at Linear.

  Mar 06, 26

• animations.dev • Animations on the Web

  Mar 06, 26

• 12 Principles of Animation • A guide to the foundational principles of animation.

  Mar 05, 26

• Developing Taste • Why taste matters and how to develop it.

  Mar 05, 26

• Design Engineering at Vercel • Learn what Design Engineers are and what they do at Vercel.

  Mar 04, 26