Open Source · MIT License · v1.96.0

Build Admin Dashboards
Your AI Agent Understands

GridKit is a zero-dependency PHP component framework designed for AI agents. 17 components, 1 CSS + 1 JS file, no build process. Your agent reads the skill file and builds complete CRUD applications in seconds.

View on GitHub Agent Skill Live Demo
16
Components
0
Dependencies
2
Files (CSS + JS)
6
Themes
UnitVATStatusActions
ART-001Web Design Package Sflat€1,200.0020%active
ART-002Hosting Standardpcs€9.9020%active
ART-003SEO Consultingh€95.0020%inactive
ART-004Logo Designflat€450.0020%draft
ART-005Newsletter Setupflat€350.0020%active
ART-006Social Media Packageflat€680.0020%active
ART-007Email Marketingflat€420.0020%draft
ART-008Content Creationh€75.0020%active

That is not a screenshot — search it, sort a column, change the filter. It is GridKit rendering itself from twelve rows of PHP. Point it at a database instead and the same calls answer over AJAX.

Why GridKit?

Everything you need to build production-ready admin dashboards. Nothing you don't.

Agent-First Design

Built with AI agents in mind. Feed the skill file to your AI assistant and it generates complete GridKit applications — tables, forms, modals, authentication.

Zero Dependencies

One CSS file. One JS file. No npm, no Composer, no build process. Clone and go. Works with any PHP 8.2+ project.

Material Design 3

6 complete themes (Indigo, Ocean, Forest, Rose, Amber, Slate) with light and dark mode. All via CSS Custom Properties.

AJAX-First

No page reloads. Tables search, sort, filter, paginate via AJAX. Forms submit and validate via AJAX. Everything stays fast.

Fluent PHP API

Declarative, chainable API. Define a complete data table with search, sorting, pagination, and modals in under 15 lines of PHP.

Responsive by Default

Every component is mobile-ready. Tables switch to card layout, sidebars become overlays, forms reflow to single column.

A Theme Is One Number

Colours are derived in OKLCH from a single hue, so every theme keeps the same lightness and the same contrast — white on the primary surface measures between 4.69:1 and 5.73:1 across all six, so every one of them clears WCAG AA rather than most of them.

The six GridKit themes side by side, same components
CSS · a complete seventh theme 
[data-gk-theme="mint"] { --gk-theme-hue: 175; }

Agent Skill — Let AI Build For You

Give your AI agent the GridKit skill file. It knows every component, every pattern, every best practice.

How It Works

The GridKit Agent Skill is a structured document that teaches any AI assistant (Claude, GPT, Gemini, or any LLM) how to use GridKit optimally. It contains component references, code patterns, and best practices — every public method of every component, in one file an agent can read in one go instead of searching a docs site for it.

  1. Install it: cp -r skill ~/.claude/skills/gridkit — or point any assistant at gridkit.at/skill
  2. Add it to your AI agent's context or project knowledge
  3. Describe what you need: "Create a user management dashboard"
  4. The agent generates working GridKit PHP code — tables, forms, modals, all wired up
Agent + GridKit Skill
// Click a scenario below to see it in action
 
user> Build me a product management table

GRIDKIT_SKILL.md

View on GitHub

Add this file to your AI agent's project context. It contains complete documentation for all 17 components, code patterns, JavaScript API reference, and common recipes.

Seventeen Components, One API

Each component follows the same fluent PHP API. Chainable, declarative, zero boilerplate.

PHP — Complete CRUD in 12 lines 
$table = new Table('products');
$table->query($db, "SELECT * FROM products ORDER BY name")
    ->search(['name', 'sku'])
    ->column('name', 'Product', ['sortable' => true])
    ->column('sku', 'SKU', ['width' => '120px'])
    ->column('price', 'Price', ['format' => 'currency', 'sortable' => true])
    ->column('is_active', 'Status', ['format' => 'label'])
    ->button('edit', ['icon' => 'edit', 'modal' => 'edit_product'])
    ->button('delete', ['icon' => 'delete', 'modal' => 'del', 'color' => 'error'])
    ->modal('edit_product', 'Edit', 'forms/product.php', ['size' => 'medium'])
    ->newButton('New Product', ['modal' => 'edit_product'])
    ->paginate(25)
    ->render();

Table

Search, sort, paginate, groupBy, number columns

Form

16-column grid, 15 field types, AJAX submit

Sidebar

Groups, badges, collapse, mobile overlay

Header

Fixed, search, user menu, theme switcher

Modal

Stackable dialogs, form-ready, sizes

StatCards

KPI display with trends and colors

Auth

Session auth, bcrypt, remember-me

Theme

6 themes, light/dark mode

Button

Filled, outlined, text, tonal, FAB

Layout

Sidebar-first, header-first modes

FilterChips

Clickable filter chip buttons

YearFilter

Year navigation filter

Questions people ask

Short answers. The long ones are in the API document.

Can I build a PHP admin dashboard without a JavaScript framework?

Yes — that is what GridKit is for. You write PHP; it renders the table, the form and the layout as plain HTML, and one JavaScript file handles sorting, searching, filtering and paging over AJAX. There is no React, no Vue and no client-side state to keep in step with your database.

Does it need npm, a build step or a bundler?

No. GridKit is one CSS file and one JavaScript file, both ready to serve. A git clone is a working install; composer require mmollay/gridkit is the same thing without the demo. Nothing compiles, nothing is generated, and there is no lock file to keep current.

How do I make a sortable, searchable table with pagination in PHP?

Four chained calls: (new Table('invoices'))->setData($rows)->search(['number', 'customer'])->column('number', 'No.', ['sortable' => true])->paginate(25)->render(); The search box, the filter dropdowns, the sort and the pager are wired up and work over AJAX without a page reload. The same table also renders server-side for the first paint, so it is there before any script runs.

Does it work with my existing project, router and database?

It has no opinion about any of them. GridKit is not a framework in the routing-and-ORM sense: no router, no ORM, no service container, no bootstrapping. You hand it arrays or a PDO connection and it renders. It sits inside Laravel, Symfony, CodeIgniter or a folder of PHP files equally well, because it never asks what is around it.

What does "built for AI agents" actually mean?

One document, GRIDKIT_SKILL.md, describes the entire API in a form an assistant can read in a single pass: every component, every option, the markup contracts and the mistakes people make with them. Put it in your agent's context and it writes GridKit code that runs instead of inventing method names. The document is built from the same source as the library, and a test fails when it falls out of date.

How is this different from a Bootstrap or Tailwind admin template?

A template gives you markup to copy. GridKit gives you PHP objects that produce the markup, so a table is one call rather than forty lines of HTML you then maintain by hand. It also brings the behaviour — sorting, filtering, paging, modals, confirmations, toasts — which a CSS template leaves to you. And there is no utility-class build step: the stylesheet is finished when you download it.

Is it responsive, and does it have a dark mode?

Yes to both. Six colour themes, light and dark, switched with one attribute on the body and remembered per user. Tables collapse to cards on a phone or scroll sideways, whichever you choose per table. The sidebar folds to icons and opens as a drawer on small screens.

What does it cost, and what licence is it under?

Nothing, and MIT. Use it commercially, change it, ship it inside a closed-source product — the licence asks only that the copyright notice travels with the code.

Which PHP version does it need?

PHP 8.2 or newer. The only optional extension is mbstring, and the library works without it — which is checked by a test rather than promised in a readme.

Is it accessible to screen readers and keyboard users?

It is built to be, and it is measured rather than claimed: tables carry column headers and their sort state, dialogs hold focus and hand it back, disclosure controls announce whether they are open, and every icon-only button has a name. Each of those is asserted by a test that was checked by breaking it first.

Get Started in 30 Seconds

Composer or a plain checkout — there is no build step either way.

Terminal 
# Composer
composer require mmollay/gridkit

# or clone — a checkout is a working install, there is nothing to build
git clone https://github.com/mmollay/gridkit.git

# Copy the skeleton as your starting point
mkdir -p my-app && cp gridkit/skeleton.php my-app/index.php

# That's it. Open my-app/ in the browser.
php -S localhost:8000
Star on GitHub Explore Components