Glyph Skill

// Glyph System Config
const config = {
  theme: "developer-taste",
  color: {
    primary: "#1a1a17",
    background: "#f4f0e8",
    border: "rgba(0,0,0,0.08)"
  },
  typography: {
    headings: "Host",
    body: "Inter",
    tracking: "-0.03em"
  }
}

  container: {
    text: "720px",
    standard: "1080px",
    wide: "1280px"
  },
  spacing: "4px-grid",
  padding: {
    mobile: "80px",
    desktop: "120px"
  }
}
// Layout Constraints
const layout = {

    "floating-decoration-orbs",
    "poppins-font-default"
  ],
  enforced: [
    "tactile-active-press",
    "visible-focus-outlines",
    "hover-interaction-durations"
  ]
}
// Anti-Slop Safeguards
const antiSlop = {
  banned: [
    "purple-gradients",

y-0pxy-100pxy-200pxy-300pxy-400pxy-500pxy-600pxy-700pxy-800px

(0,0)

Design websites and products with taste, not just with AI slop.

An enforceable brand, layout, and documentation skill for your AI coding assistant. Import strict layout constraints, typography locks, color variables, and animation limits.

Install Glyph Read Documentation

$npx skills add sumitttt4/Glyph-Skill

Compatible coding agents

CodexClaude CodeCursorGemini CLIAI Studiov0LovableWindsurfCopilot

Designed with Taste

Built with Glyph Skill

Real landing pages and web applications generated using AI assistants equipped with Glyph system constraints.

SaaS Landing Page

Glyph Site Generator

AI landing page builder styled in a cool warm paper and glassmorphic technical theme.

Workspace Interface

Nowar App Workspace

Productivity application interface featuring solid orange accents and clean wireframe elements.

Health & Fitness App

Nova Calendar Blueprint

Fitness and health agenda interface structured around a strict calendar grid system.

0 Rule Categories

Design rules your coding assistant can implement.

Glyph converts abstract design taste into structured prompt instructions, tokens, grids, and boundaries.

Group 01

Foundational Aesthetics

Core Color Rules

Accent consistency locks, max text colors per surface, contrast requirements, and industry-standard palettes.

contrast lock4.5:1 (AA)

Ink•Paper

Typography Rules

Font pairing stacks, negative heading tracking, weight limits, and strict 65-character line length locks.

heading tracking-0.04em

Host Grotesk Display

Layout Rules

A locked 4px grid system, standard container widths (720/1080/1280px), and unified padding parameters.

container width1080px

Standard

Group 02

Clean Engineering & Quality Locks

Component Rules

Detailed design specifications for 22 interface component types, including forms, navbars, tables, and modal elements.

[LOGO]

rulesdocsinstall

[CTA]

Anti-Slop Rules

Active bans on mesh blobs, Poppins defaults, floating decoration orbs, AI sparkle icons, and vague copywriting.

✕Poppins Default Font

✕Purple-to-Pink Gradients

✕Floating Decoration Orbs

Framework Rules

Clean implementation constraints for React, Next.js, Svelte, Tailwind, and custom styled templates.

Background Rules

Limits on visual background patterns, gradient overlay masks, filters, and backdrop blur variables.

Group 03

Responsive & UX Dynamics

Motion Rules

Animation caps (400ms max), cubic-bezier easing curves, active press scaling, and transition constraints.

Accessibility Rules

Visible focus outlines, keyboard navigation paths, touch target minimums, and ARIA landmark constraints.

Responsive Rules

Folding breakpoint triggers, custom mobile spacing metrics, container collapse rules, and overflow control.

Install

Add Glyph Skill to your AI coding workflow.

The repository includes SKILL.md plus generated layout rules, typography locks, color systems, and animation guidelines.

Compatible Assistants:CursorClaude CodeWindsurfVS Code

terminal

$npx skills add sumitttt4/Glyph-Skill

View GitHub Repo Read SKILL.md Open Glyph Software