ui
User interface design and implementation
Informations de source
- Dépôt
- ffsshhttiikk/opencode-agents-skills
- Dernière activité de la source
- 28 février 2026 à 22:55
- Langue détectée de SKILL.md
- anglais
- Étoiles
- 3
- Forks
- 2
Options d'installation
Le prompt qui vérifie d'abord la source est sélectionné par défaut. Vous pouvez passer à une commande directe ou télécharger une copie locale.
Vérifiez les fichiers source
Lisez SKILL.md et les fichiers associés affichés par SkillsMP avant de décider de l'installer.
Affichage de SKILL.md
SKILL.md
Instructions source · Aperçu en lecture seule- name
- ui
- description
- User interface design and implementation
- license
- MIT
- metadata
- {"audience":"developers","category":"design"}
## What I do
- Design visual interfaces for applications
- Create component hierarchies and layouts
- Implement responsive designs
- Apply design systems and patterns
- Handle typography, color, and spacing
- Build interactive UI components
## When to use me
When building user-facing interfaces for web, mobile, or desktop applications.
## Key Concepts
### Layout Techniques
```css
/* Flexbox */
display: flex;
justify-content: space-between;
align-items: center;
/* Grid */
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
```
### Component Patterns
- Atomic design (atoms, molecules, organisms)
- Container/presenter pattern
- Higher-order components
- Compound components
### Responsive Design
```css
/* Mobile-first approach */
.container {
padding: 1rem;
}
@media (min-width: 768px) {
.container {
padding: 2rem;
}
}
@media (min-width: 1024px) {
.container {
max-width: 1200px;
margin: 0 auto;
}
}
```
### Design Systems
- Define typography scale
- Establish color palettes
- Create spacing tokens
- Build component library
- Document usage guidelines
Voir sur GitHub