frutiger-aero
Web and App implementation guide for Frutiger Aero. Trigger when user wants glossy gradients, early 2000s nature-inspired tech, glass, and water motifs.
Frutiger Aero
"The aesthetic of mid-2000s optimism. Glossy plastic, clear water, blue skies, and eco-friendly technology."
When to Use
Use this sub-style when the user's request matches the aesthetic described above. This is a child reference of the design-it skill and is not meant to be triggered directly.
Core Principles
- Hyper-Glossy Textures: Buttons look like polished glass or wet plastic. Extensive use of convex gradients and specular highlights.
- Skeuomorphic Nature: Motifs of green grass, blue skies, water droplets, and bubbles intersecting with sleek glass technology (think Windows Aero or early iOS).
- Translucency: Frosted glass effects, but much more saturated and reflective than modern glassmorphism.
Visual DNA
- Colors: Cyan, sky blue, lime green, and pure white. Avoid dark themes entirely.
- Typography: Clean, highly legible humanist sans-serifs (like the font Frutiger,
Segoe UI, orMyriad Pro). - Styling: Drop shadows are deep. Highlights are bright, sharp white lines at the top of buttons.
Web Implementation
- Use multiple box-shadows (inset for the gloss, outset for depth) and linear-gradients.
- CSS Example:
body {
/* Classic blue sky / green grass gradient */
background: linear-gradient(to bottom, #87CEEB 0%, #E0F6FF 60%, #98FB98 100%);
font-family: 'Segoe UI', Tahoma, sans-serif;
}Subscribers only
The full skill, its 1 bundled files and every download is included with every paid Complete AI plan.
Details
| Source | self |
|---|---|
| License | — |
| Risk label | safe ("critical" means the skill may run commands or touch files — read before use) |
| Files | SKILL.md |
| Added | 2026-06-17 |
Related skills
3d-ui
Web and App implementation guide for 3D UI. Trigger when user wants actual 3D objects, perspective effects, and spatial depth.
ai-native-ui
Web and App implementation guide for AI Native UI. Trigger when user wants conversational interfaces, adaptive layouts, and generative AI aesthetics.
aurora-ui
Web and App implementation guide for Aurora UI. Trigger when user wants gradient glows, color blobs, and atmospheric lighting effects.
bento-ui
Web and App implementation guide for Bento UI. Trigger when user wants modular grid cards, Apple-like dashboard style, or sections arranged like a bento box.
brutalism
Web and App implementation guide for Brutalism. Trigger when user wants a raw appearance, intentionally unfinished look, and rejection of standard design conventions.
brutalist-typography
Web and App implementation guide for Brutalist Typography. Trigger when user wants huge fonts, raw presentation, and aggressive layout decisions.
