Google Antigravity Agent Skill
Every deck, page, app screen, and document — built to the Sngular Design System automatically.
sngular-design is a packaged Antigravity Pair-Programming Skill: install it once, and the agent reaches for the Sngular brand rules — color, type, logo, tone, and layout — every time someone asks for a piece with the brand, without anyone having to explain the guidelines again.
114 KB · works in Google Antigravity IDE, agy CLI, and Gemini / Claude Agents
What's inside
One package, the whole design system
Nothing is invented on the fly. Every color, typeface, logo file, and layout rule the agent uses comes straight from these files.
SKILL.md
The routing logic: decides whether a request is a deck, a web page, an app screen, a document, or a brand review, and which reference to read next.
references/
Six concrete guides: brand foundations, voice & messaging, presentations, web, apps, and documents — each with strict rules for that channel.
assets/tokens.json & tokens.css
Every color, spacing, radius, and type-scale value as design tokens — so nothing gets hand-typed or approximated in code.
assets/logos/
The 8 official S|NGULAR files — positive, negative, and solid, in both logotype and isotype — ready to drop in as vector SVGs, never redrawn.
assets/fonts/
Outfit, the brand's variable typeface, openly licensed under the OFL — so it renders identically everywhere, no substitutions needed.
assets/templates/
The official Sngular Word document template, so written deliverables start from the real thing instead of a blank page.
scripts/check_contrast.py
A standalone WCAG 2.1 AA mathematical contrast checker, ensuring every color pairing passes accessibility before shipping.
AGENTS.md & GEMINI.md
Invariant guardrail rules injected into every turn. Enforces the 95/5 palette and strictly prohibits unauthorized colors on titles.
Outcome Showcase • Sngular Skill Marketplace
What /sngular-design Delivers
Explore production-grade deliverables generated directly by Google Antigravity across all 5 delivery channels. Every piece below strictly enforces the 2025 Brand Book — try the live preview or copy the prompt into your agent.
Executive Briefing & Architecture Deck
Interactive 16:9 slide canvas featuring Navy/White alternating rhythm, presenter mode (F), speaker notes drawer, and top-right S| isotype.
Cloud AI Enterprise Platform Showcase
High-impact marketing page with SpecialTitle badge, stat bands (+1,300 engineers), square solution cards with 0px radius, and testimonial quotes with the Cursor gesture.
Engineering Velocity & Token Dashboard
Mission-critical ops dashboard with 4 KPI cards, weekly PR velocity trend charts, automated WCAG AA compliance gauges, and squad deployment status tables.
Client Engagement & Squad Delivery Portal
Multi-pane web application workspace with dark Navy sidebar (#061B2B), active route indicators, search filtering, progress tracking, and team milestone cards.
Agent Execution Status & Synthesis Card
Compact interactive widget designed for chat embedding via <agent-embed> with live status indicator, execution metrics, and step verification checklist.
Field Service & On-Site Check-In Screen
Touch-friendly mobile interface rendered in a realistic iPhone bezel with dynamic island, iOS status bar, active task checklist, and 4-destination bottom tab bar.
Technical Architecture & Installation Spec
Strict adherence to corporate document standards: A4 layout, Verdana body typography, Blue headers, zebra tables, and callout blocks with zero prohibited blues.
How it decides
One skill, five channels
The skill reads the request first, then only the reference it actually needs — decks and documents are never mixed up with a landing page.
| User Request | Channel | Priority |
|---|---|---|
| Deck, slides, presentation, proposal, pitch, kick-off, webinar | Presentation | 1 |
| Website, landing page, hero, newsletter, banner | Web | 2 |
| App screen, flow, dashboard, prototype | App | 3 |
| Document, report, brief, memo, SOW, Word, Google Docs | Document | 4 |
| "Does this comply with the brand?" | Review | — |
A checklist before anything ships
A short sample of the pre-flight checklist built into the skill — the full list lives inside SKILL.md.
Documentation Map
Which Document Should You Use?
The skill includes several documentation resources. Choose the right file according to your immediate goal:
The primary developer entry point. Contains package extraction instructions, folder hierarchy, and common slash command usage.
The formal technical manual compliant with Word/Google Docs styling specifications (Verdana body, 17.5 cm tables, WCAG matrices).
The executable skill specification read automatically by the AI agent to orchestrate channel routing and quality checklists.
Install
Set it up in under a minute
The skill distributes as a single compressed package (sngular-design-antigravity.tar.gz). Simply download, unzip into your skills directory, and you are ready.
Download the package
Use the download button on this page to save sngular-design-antigravity.tar.gz to your computer.
Download Package (~114 KB)Unzip into your Antigravity skills directory
Extract the package directly into your Antigravity skills location:
mkdir -p ~/.gemini/config/skills
tar -xzf sngular-design-antigravity.tar.gz -C ~/.gemini/config/skills/
You can also double-click to extract the archive in macOS Finder or Windows Explorer and place the sngular-design folder into ~/.gemini/config/skills/ or in your workspace .agents/skills/.
That's all — Ask for anything on-brand
Open Google Antigravity or the agy CLI. The skill is detected immediately. Ask for a presentation, landing page, document, or brand review:
/sngular-design Create an executive presentation for our new cloud architecture proposal