Wink Pings

AI-Generated Frontends Have a Plastic Feel—These 10 GitHub Repos Are Fixing It

AmirMušić lists 10 GitHub repos for AI design/motion studios, totaling 140K stars. Hallmark sets a design floor, Emil Kowalski’s skills handle motion taste, and the official GSAP skill pack keeps timelines from breaking. Includes install commands and theme screenshots.

AI-generated interfaces are easiest to spot when the page feels plastic the moment it opens. The code runs, the layout is tidy, but every heading has a little eyebrow label above it, every button bounces, and the color palette looks like the same template with a new skin.

In his tweet, AmirMušić lists 10 GitHub repos for AI design/motion studios, totaling 140K+ stars. Most of these repos are skill packs for AI coding assistants, not traditional frontend libraries. Once installed into Claude Code, Cursor, or Codex, the assistant first reads a set of rules when generating pages and motion. Below, they’re broken down by the problem they solve.

Hallmark: Setting a Floor for AI Design

Hallmark has 48.5K stars and was made by Together AI. Its goal isn’t to make pages fancier; it’s to keep pages from looking AI-generated.

Hallmark repo cover

The approach is very concrete. The repo contains 50 themes, and each theme is a set of materials: paper, type, color, surfaces, components, and texture. At build time it serves three themes, and pages are built around the task the visitor needs to complete. A booking page can book, a store can sell, and a newsletter page can subscribe. Themes don’t dictate what goes on the page or in what order, so the same theme with two prompts will produce two different pages.

Finally, there’s a sloplint. It checks for machine-made tells in a real browser at 8 widths: a little eyebrow above every heading, letter-spaced all-caps labels, one colored word in a heading, a page of empty boxes or nothing but photos, a hero that overflows the screen, an email signup at the bottom of every page, and a form that shows a thank-you without sending. Hallmark splits checks into three layers. Floor never allows contrast, focus, reduced motion, fabricated facts, or broken mobile layout. Reflex covers pitfalls models fall into by default; you can override them with a reason in the record. Finish covers craft details and doesn’t block shipping. Finally, a fresh-context reviewer audits it.

Install: npx skills add nutlope/hallmark -g. Requires Node 18+. Browser checks and screenshots also require npm i -g puppeteer-core and Chrome. It also supports /hallmark redesign <path> and /hallmark audit <path>.

Dusk theme
Cobalt theme
Studio theme
Atelier theme
Ribbon theme

emilkowalski/skills: Breaking Motion Taste Into Rules

emilkowalski/skills has 53.7K stars. The author, Emil Kowalski, has done design engineering at Vercel and Linear. The repo puts it bluntly: agents don’t have great taste. AI doesn’t replace domain knowledge; it amplifies it.

The pitfalls it lists are small, but they add up. An entrance animation should use ease-out, but the agent picks ease-in. A UI should use a translucent shadow, but the agent picks a solid border. None of these choices is fatal on its own, but stacked across one interface, they decide whether the result feels smooth or crude.

This repo splits motion work into multiple skills: animate builds animations from scratch and chooses curves, durations, and properties; review-animations reviews animations against strict rules; improve-animations scans the codebase and gives a prioritized plan; find-animation-opportunities finds places that genuinely need motion and also tells you what shouldn’t move; remove-animations removes unnecessary motion; choreograph manages the order of multiple elements; animation-performance fixes dropped frames; plus apple-design, mobile-native, break-ui, pick-ui-library, prototype, and more.

Install: npx skills@latest add emilkowalski/skills.

GSAP skills: Don’t Let the Agent Invent Timelines

GSAP skills has 17.9K stars and is the official GreenSock repo. It solves a very common problem: agents can write GSAP, but they easily invent broken timelines. The official skill teaches it the correct core API, timeline, ScrollTrigger, plugins, React/Vue/Svelte usage, and performance handling.

GSAP is now 100% free, including all plugins. After Webflow acquired GSAP, formerly Club GSAP plugins such as SplitText and MorphSVG are also free for everyone, including commercial use. Just install the public gsap npm package; no membership, .npmrc, auth token, or private registry is needed.

Install: npx skills add https://github.com/greensock/gsap-skills.

7 More on the List

  • Remotion skills, 6.4K stars, official agent skills for generating MP4s with React.
  • Pixel Plays, 400 stars, the tweet author’s own project, for writing isometric pixel games in pure JS.
  • Stageshow, 2.1K stars, for fake product UI stills, cursor demos, and bento grids.
  • threejs-skills, 4K stars, Claude skills pinned to three.js r186 and R3F.
  • LottieFiles motion-design-skill, 2.8K stars, handles timing, easing, and choreography.
  • awesome-gamedev-agent-skills, 6.9K stars, 77 game development skills with a router, covering Godot, Unity, Unreal, and three.js.
  • claude-motion, 840 stars, turns taste rules into numbers and gives coding agents contact-sheet frame audits.

Star counts don’t prove fit, but they show how widespread the pain point is. If you want to fix the plastic feel first, install Hallmark. If motion is always a beat off, add emilkowalski/skills. If your project uses GSAP, install the official skills. Don’t cram everything in at once—add them as your project needs them.

发布时间: 2026-11-06 07:33