Frontend Skill
Pulled from OpenAI's internal skills repository, this gives you their production frontend playbook for building landing pages and UI with restrained composition. It's designed to work with Claude's design system mode, so you get opinionated guidance on visual hierarchy and layout decisions rather than just component libraries. Useful when you want to ship clean, focused interfaces without overthinking every spacing decision. The triggers are broad enough that it'll activate when you're working on any frontend task, which means you're getting OpenAI's house style whether you asked for it or not. Worth trying if you like their aesthetic, but know it's going to push you toward minimalism.
- skills.sh installs
- 3.2K
- GitHub stars
- 106.9K
- last updated
- Aug 21, 2026
Install
$ npx -y skills add nexu-io/open-design --skill frontend-skill --agent claude-codeInstalls into .claude/skills of the current project.
Files
frontend-skill
Curated from OpenAI's skills repository.
What it does
Create visually strong landing pages, websites, and app UIs with restrained composition. OpenAI's production frontend playbook.
Source
- Upstream: https://github.com/openai/skills
- Category:
design-systems
How to use
This catalogue entry advertises the skill in OpenDesign so the agent discovers it during planning. To run the full upstream workflow with its original assets, scripts, and references, install the upstream bundle into your active agent's skills directory:
# Inspect the upstream README for exact paths
open https://github.com/openai/skills
Then ask the agent to invoke this skill by name (frontend-skill) or with
one of the trigger phrases listed in this skill's frontmatter.
Sponsors
Agent CaffeineSponsoredClose your lid, come back to finished work
SnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthly
WaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthly
knobsSponsoredSee your site on any phone, any day, in any languageDetails
- Repository
- github.com/nexu-io/open-design
- Categories
- Frontend Development, AI & Agent Building, Design & UI/UX
- First seen
- Jun 3, 2026
More from nexu-io/open-design
All 217- Data Report3.2K
- Copywriting3.2K
- Color Expert3.1K
- Docx3.1K
- Pdf3.1K
- Brand Guidelines3.1K
- Ui Skills3.1K
- Pptx3.1K
- Flutter Animating Apps3.1K
- Canvas Design3.1K
- Remotion3.1K
- Plan Design Review3K
- Pptx Generator3K
- Swiftui Design3K
- 8 Bit Orbit Video Template3K
- Shadcn Ui3K
- Gsap Core3K
- Slides3K
- Marketing Psychology3K
- Frontend Slides3K
- Web Artifacts Builder3K
- Agent Browser3K
- Design Consultation3K
- Gsap Scrolltrigger3K
Recommended
More Frontend Development
react-hook-formpproenca/dot-skillsReact Hook Form performance optimization for client-side form validation using useForm, useWatch, useController, useFieldArray, the subscribe() API, and the Wat3.1Kskills.sh installs
shadcn-uinexu-io/open-designBuild UI components with shadcn/ui. Pairs with the Stitch design loop to ship structured, accessible components quickly.3Kskills.sh installs
react-pdfvercel-labs/json-renderReact PDF renderer for json-render. Use when generating PDF documents from JSON specs, working with @json-render/react-pdf, or rendering specs to PDF buffers/st2.4Kskills.sh installs
frontend-testing-best-practicessergiodxa/agent-skillsTesting best practices for the frontend. Emphasizes E2E tests over unit tests, minimal mocking, and testing behavior over implementation details. Use when writi2.2Kskills.sh installs