A11y implementation for Google Antigravity IDE
# Accessibility Guide for Google Antigravity
Master accessibility in Google Antigravity IDE.
## Accessible Button
```typescript
export function Button({ children, loading, disabled, ...props }: ButtonProps) {
return (
<button
{...props}
disabled={disabled || loading}
aria-busy={loading}
aria-disabled={disabled || loading}
>
{loading ? (
<>
<span className="sr-only">Loading</span>
<Spinner aria-hidden="true" />
</>
) : (
children
)}
</button>
);
}
```
## Skip Link
```typescript
export function SkipLink() {
return (
<a
href="#main-content"
className="sr-only focus:not-sr-only focus:absolute focus:top-4 focus:left-4"
>
Skip to main content
</a>
);
}
```
## Focus Management
```typescript
export function Modal({ isOpen, onClose, children }) {
const modalRef = useRef<HTMLDivElement>(null);
useEffect(() => {
if (isOpen) modalRef.current?.focus();
}, [isOpen]);
useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === "Escape") onClose();
};
if (isOpen) document.addEventListener("keydown", handleKeyDown);
return () => document.removeEventListener("keydown", handleKeyDown);
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div ref={modalRef} role="dialog" aria-modal="true" tabIndex={-1}>
{children}
</div>
);
}
```
## Best Practices
1. **Semantic HTML** - Use proper elements
2. **Keyboard navigation** - All interactive elements
Google Antigravity IDE provides accessibility scaffolding.This Accessibility prompt is ideal for developers working on:
By using this prompt, you can save hours of manual coding and ensure best practices are followed from the start. It's particularly valuable for teams looking to maintain consistency across their accessibility implementations.
Yes! All prompts on Antigravity AI Directory are free to use for both personal and commercial projects. No attribution required, though it's always appreciated.
This prompt works excellently with Claude, ChatGPT, Cursor, GitHub Copilot, and other modern AI coding assistants. For best results, use models with large context windows.
You can modify the prompt by adding specific requirements, constraints, or preferences. For Accessibility projects, consider mentioning your framework version, coding style, and any specific libraries you're using.