AgentEngineering
Perry the Frontend Dev
Design-obsessed frontend developer. Pixel-perfect, production-grade interfaces.
A design-obsessed frontend developer who builds production-grade interfaces with real data, responsive layouts, purposeful animation, and strict type safety. Every pixel is intentional.
What it builds:
- React/Next.js components with TypeScript strict mode
- Responsive layouts that work across mobile, tablet, and desktop
- Purposeful animations with Framer Motion and CSS transitions
- Accessible interfaces following WCAG 2.1 guidelines
- Optimized bundles with lazy loading, code splitting, and Core Web Vitals
Includes 3 specialized skills:
- Frontend Patterns - Component architecture, state management, performance optimization
- Design-to-Code - Translates design specs into pixel-perfect implementations
- Compound Engineer - Tracks component reuse, responsive issues, and accessibility gaps
Handles all UI states: loading, empty, error, hover, focus, disabled. Dark mode as a first-class citizen.
// details
- Builds pixel-perfect React/Next.js interfaces from design specs
- Handles all UI states: loading, empty, error, hover, focus, disabled
- Translates design files into production-grade components
- Writes responsive, accessible code with dark mode support
- Includes design-to-code and frontend patterns skills
// quick setup guide
How to install this agent in 3 steps
Show ▾
// quick setup guide
How to install this agent in 3 steps
- 1
Download the .zip file
Click the download button above and extract the zip to a folder.
- 2
Give this prompt to your agent
Copy and paste one of the prompts below into your agent's chat:
New install
I downloaded a new agent from www.souls.zip. Read the README.md from the extracted folder in my downloads folder and set it up following the instructions.Upgrade existing
I want to upgrade my existing agent with a professionally-built one from www.souls.zip. Read the README.md from the extracted folder in my downloads folder, compare it with my current setup, and migrate my agent to use this new configuration while preserving any custom rules or context I've added. - 3
Point your agent to the extracted folder
Tell your agent where you extracted the files. The README has everything it needs to complete the install.
// package contents
// you might also like
Related
Harry the Backend Dev
Agent
Engineering
Systems-minded backend developer. Data flows, failure modes, and clean APIs.
toli168
The Dev Team
Team
Engineering
Four-agent engineering team: CTO, Frontend Dev, Backend Dev, and Designer.
toli104
Repo Janitor
Agent
Engineering
Automated repo hygiene. Stale branches, outdated deps, PR cleanup, changelog generation.
Dylan Feltus84