717 skills · sorted by relevance
Build responsive interfaces that follow an existing design system and support accessible interaction. Covers component structure, state management, keyboard controls, and loading, empty, and error states, with checks across screen sizes and assistive tools.
Review interface animation code for timing, natural movement, responsiveness, rendering performance, and accessibility. Receive a table of specific problems, suggested changes, and reasons, followed by a clear decision on whether the motion meets the review standards.
Build websites, dashboards, and application screens with a clear visual direction and working frontend code. The skill covers typography, color, layout, responsive behavior, and interaction states while following existing project conventions and brand guidance.
Build and review web animations with GSAP's core API, including movement, rotation, fades, and staggered starts. Adjust timing and easing, meaning changes in speed, and adapt animations to screen size and reduced-motion preferences.
Design and improve website and app interfaces, from typography, spacing, and color to task flows. Review usability, accessibility, responsive layouts, and performance, or refine interface text, error states, and reusable design elements.
Review images displayed at different screen sizes and help browsers select appropriately sized files. Check srcset image options, sizes display-width hints, and CSS layout together to identify oversized mobile downloads or mismatched image variants.
Audit web images that are larger than their displayed size and help serve suitable versions for different screens. Review image dimensions, responsive image settings, and Lighthouse findings, then provide updated HTML and steps to verify the changes.
Review and implement dark mode using CSS variables and the user's operating system preference. Check fixed colors, contrast, responsive layouts, and interaction states, with guidance for adding a manual theme switch that remembers the user's choice.
Review image dimensions to find risks of layout shift, where content moves as images load. Get file-level findings and before-and-after HTML using correct width, height, and responsive CSS, while accounting for small decorations with stable sizing.
Review CSS focus indicators, the visible outlines that show which element receives keyboard input. Identify missing, clipped, or misplaced indicators, check contrast and responsive states, and guide changes that make keyboard navigation easier to follow.
Review and adapt component CSS using container queries, rules based on the space a parent element provides. This helps cards and other components adjust across sidebars, grids, and full-width layouts.
Create and review GSAP code that animates webpage elements and SVG graphics. Covers movement, fades, easing that controls speed changes, staggered effects, playback controls, and adaptations for screen size and reduced-motion preferences.
Design and implement web or iOS interfaces using the product’s existing components and design rules. Define required screen states and responsive behavior, consult optional visual references when useful, and inspect the rendered result when supported.
Design reusable interface components in React, Vue, and Svelte. Organize how components fit together, define clear configuration options, and choose styling approaches while addressing accessibility, responsive layouts, and maintenance across component libraries or design systems.
Check Codewhale release readiness through ordered tests, builds, version checks, and manual terminal checks. Record command results and observed behavior, including responsiveness, route isolation, and follow-up input handling, while explicitly identifying any skipped checks.
Create a consistent UI design system from brand colors. Generate design tokens, reusable values for colors, typography, and spacing, and support component documentation, responsive layout calculations, accessibility considerations, and clear handoff materials for developers.
Design and review web and mobile interfaces using searchable guidance on colors, fonts, layouts, charts, and interaction. Generate a consistent design plan, then apply framework-specific advice and checks for accessibility, responsiveness, and visual consistency.
Guide website and web app development through implementation, builds, testing, and visual checks in a real browser. The workflow covers responsive layouts, accessibility, reusable components, and screenshots, with production checks after deployment when applicable.
Diagnose unresponsive GKE GPU or TPU nodes and pods stuck terminating through read-only checks of node status, logs, serial output, and repair history. Receive documented recovery guidance to apply yourself.
Create and review GSAP code that animates webpage elements and SVG graphics. Covers movement, fades, easing that controls speed changes, staggered effects, playback controls, and adaptations for screen size and reduced-motion preferences.
Review OpenClaw frontend code and rendered screens for departures from Carapace design rules, accessibility issues, responsive defects, and inconsistent copy. Produce evidence-based JSON and Markdown reports that distinguish documented violations from judgment-based suggestions and guide narrowly scoped fixes.
Review and improve interface grouping, alignment, spacing, and responsive structure. Check whether content and actions remain accessible when screens resize, text grows in translation, zoom increases, or the layout switches to right-to-left reading.
Design and implement browser game interfaces that keep the playfield visible. Create status displays, menus, and overlays with a consistent visual theme, responsive layouts for desktop and mobile, and clear interaction boundaries for 3D camera controls.
Build text that reveals word by word as readers scroll. Preserve inline links, emphasis, and responsive wrapping, while keeping complete text accessible to screen readers and immediately readable when reduced motion is preferred.