# Anton Grid

> Generate responsive CSS grid layouts from a column/gap spec.

- Skill: `anton-abyzov/anton-grid` (Agent Skill)
- Install (CLI): `npx skillmds@latest add anton-abyzov/anton-grid`
- Raw SKILL.md: https://api.skillmd.com/api/skills/anton-abyzov/anton-grid/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: anton-abyzov (https://skillmd.com/u/anton-abyzov)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/anton-abyzov/anton-grid

---


# anton-grid

A small CSS-grid helper skill. Turns a plain-language layout request into a
ready-to-paste `display: grid` block with sensible responsive defaults.

## Workflow

1. Read the requested column count and gap.
2. Emit a `.grid` rule with `grid-template-columns: repeat(N, minmax(0, 1fr))`.
3. Add a mobile breakpoint that collapses to a single column.

## Example

```css
.grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

@media (max-width: 640px) {
  .grid {
    grid-template-columns: 1fr;
  }
}
```