web-design

Design and implement web interfaces with HTML/CSS/JS, React, or Vue.

24|3|Updated Jan 4, 2026
One-click install
npx skills add https://github.com/goncalossilva/.agents --skill web-design-goncalossilva
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design
Source: https://github.com/goncalossilva/.agents/tree/main/skills/web-design
Command: npx skills add https://github.com/goncalossilva/.agents --skill web-design-goncalossilva

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses the challenge of creating unique and aesthetically compelling web interfaces that go beyond generic templates, ensuring a strong visual identity and user experience.

Core Features & Use Cases

  • Aesthetic Direction: Establishes and consistently applies a bold, intentional visual style (e.g., Brutalist, Editorial, Luxury).
  • Interface Design & Implementation: Translates concepts into high-fidelity, coded interfaces using HTML/CSS/JS or modern frameworks.
  • Use Case: Design a landing page for a new SaaS product with a "Retro-futuristic" aesthetic, focusing on bold typography and neon accents, complete with responsive layout and interactive elements.

Quick Start

Design a new web page with a "Brutalist" aesthetic, focusing on strong typography and a dark color scheme.

Frequently Asked Questions about web-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I design and implement a web interface with a specific aesthetic direction?▼

To design a web interface with a specific aesthetic direction, define a visual style, typography, color, layout, and motion strategy, then execute it using semantic, accessible, and responsive HTML, CSS, and JavaScript.

Can I use this to build a web page using React or Vue?▼

Yes, you can build production-ready web pages and components using React or Vue. The Skill translates visual design concepts into high-fidelity, coded interfaces using these modern frontend frameworks.

What is the best way to create a brutalist web design for a landing page?▼

The best way to create a brutalist web design is to establish a bold, intentional visual style focusing on strong typography and a dark color scheme, then implement it with responsive and accessible code.

Does this web design approach support responsive and accessible interface implementation?▼

Yes, accessible and responsive interface implementation is supported. The process executes high-fidelity designs using semantic code, ensuring the final web application is usable across different devices and screen sizes.

How do I restyle an existing web application with a luxury aesthetic?▼

To restyle an existing web application with a luxury aesthetic, establish a strong visual identity and apply it consistently across the interface, updating the typography, color, layout, and motion strategy.