frontend▌

Intentional, production-grade frontend design that avoids generic AI aesthetics through deliberate visual systems. \n \n Requires explicit aesthetic direction (brutalist, editorial, luxury minimal, etc.) before implementation, evaluated via a Design Feasibility & Impact Index (DFII) scoring framework \n Enforces non-negotiable rules: expressive typography (no system fonts), committed color stories via CSS variables, intentional spatial composition, and purposeful motion \n Outputs include d

Build distinctive, production-grade frontend interfaces that avoid generic AI aesthetics. \n \n Guides design thinking through purpose, tone, and differentiation before implementation, emphasizing bold aesthetic direction over generic defaults \n Covers five core design areas: typography (distinctive font pairing), color and theming (CSS variables, dominant colors with sharp accents), motion (CSS animations, scroll triggers, staggered reveals), spatial composition (asymmetry, overlap, grid-break

$22

Dark-first UI design with neon accents, monospace typography, and visual discovery patterns for addictive interfaces. \n \n Emphasizes dark themes (rich blacks), terminal-inspired typography (JetBrains Mono + Space Grotesk), and neon color accents (cyan, purple, lime, coral) paired with CSS custom properties for swappable theming \n Prioritizes tactile interactions: hover lifts, staggered animations, glow effects, and micro-interactions that reward exploration and scrolling \n Recommends signatu

Full-stack React development with file-based routing, server/client rendering, data loading, and type-safe route modules. \n \n Supports file-based routing with nested routes, dynamic segments, and multiple rendering strategies (SSR, SPA, pre-rendering) \n Handles data loading via loader / clientLoader and mutations via action / clientAction with built-in form handling and optimistic UI \n Includes 10+ reference guides covering routing, data loading, actions, navigation, error boundaries, authen

Comprehensive Vue.js testing guidance covering unit, component, and end-to-end testing strategies. \n \n Addresses 11 common testing challenges including async handling, composable testing, Pinia store setup, Suspense components, and Teleport queries \n Recommends Vitest for unit and component testing infrastructure, with Playwright as the preferred E2E framework \n Covers black-box component testing patterns to prevent brittle tests during refactoring, async/await patterns to eliminate race con

Tailwind CSS utilities for animations, transitions, and transforms with built-in patterns and custom animation support. \n \n Four built-in animations (spin, ping, pulse, bounce) plus extensive transition utilities covering properties, duration, timing functions, and delays \n Transform utilities for scale, rotate, translate, and skew with configurable origin points and GPU-accelerated performance \n Custom animations via @theme in Tailwind v4, including keyframe definitions and custom easing cu

React hooks and components library for async state, reactive watching, lifecycle management, and error handling. \n \n Includes async hooks for state management and callbacks, watch hooks for reactive value tracking, and lifecycle utilities for component mounting \n Provides conditional rendering components (If/Else, Switch/Case) and error-safe hooks with built-in fallback behavior \n Offers advanced features: cross-component event bus, offset-based pagination, and fetch request/response interce

Advanced CSS Grid, Flexbox, and container query patterns for complex responsive layouts. \n \n Covers CSS Grid mastery including holy grail layouts, grid template areas, auto-fill/auto-fit, and subgrid for nested alignment \n Flexbox patterns for space distribution, flexible item sizing, and masonry-like layouts with proper overflow handling \n Container queries with named containers and container query units for component-level responsiveness independent of viewport \n Sticky and fixed position

Write user-facing copy following Sentry's brand guidelines.