designlang Files

A new home for designlang. The marketing + demo site at designlang.app has been rewritten end-to-end. The CLI itself is unchanged from v12.11.0 — this release ships the new site and (finally) fixes the broken images on the npm package page.

The new site

A complete, reactbits-quality rebuild with no carryover code from the old site.

Hero

• WebGL Grainient background (red / black, ogl-powered, GPU-paused when offscreen).
• Big Geist-Sans h1 — Reverse-engineer any website's design system.
• Live terminal card showing real CLI output, syntax-highlighted.
• Click-to-copy `npx designlang stripe.com` chip.
• Real GitHub star count in the nav, fetched server-side from the GitHub API and revalidated every 30 minutes.

\"See it work\" — live demo showcase

A massive frosted-glass stage card with:

• A real `https://` prefix + URL input + red gradient Extract button.
• Suggestion chips for stripe.com, linear.app, vercel.com, notion.so, figma.com.
• Streaming status with typed state tags (IDLE / STREAMING / DONE / HALTED) — no decorative dots.
• Live paint of the extracted palette, type specimen, spacing scale and summary numerals as they arrive.

Real gallery

The gallery is no longer fake gradients. Eight design systems were extracted with `npx designlang <host>` and committed to this repo:

Cards use the brands' actual extracted primary + accent colours for the cover gradient and the brand favicon as the cover badge.

Reddit testimonials

The \"From the threads\" section is now an auto-scrolling 3-column motion/react marquee loaded with the real comments from the r/ClaudeAI launch thread. Each card has a coloured initial avatar, the subreddit, the user, the body, the upvote count, and a working \"open ↗\" link to the thread.

Nav + footer

• Floating glass capsule nav — 1080px wide, sits inside a 14px top inset, blurred + subtle red glow. Real custom brand mark SVG on the left, segmented pill links in the middle, real GitHub star count chip + red gradient `npm i designlang` CTA on the right.
• Polished footer with brand block, four link columns (Product / Install / Integrations / Crawlers), a decorative giant outlined \"designlang\" wordmark behind the columns, and a bottom strip with version + author + license.

Aggressive SEO

• Keyword-dense title and description, ~75-keyword list.
• JSON-LD graph: `SoftwareApplication`, `Organization`, `WebSite` + `SearchAction`, `BreadcrumbList`, `FAQPage`, `HowTo`.
• `aggregateRating` filled from real GitHub stars (currently 2.6k).
• Visible FAQ section + ~250-word about block.
• Sitemap includes the 8 gallery brand books.
• Rewritten `llms.txt` for AI-search citability — explicitly allows GPTBot, ClaudeBot, PerplexityBot, Google-Extended, Applebot-Extended, OAI-SearchBot, Bytespider, CCBot, cohere-ai, meta-externalagent, FacebookBot, Amazonbot, DuckAssistBot and mistral-ai-user.

Web extractor — parity with CLI

`/api/extract`'s file output now includes the brand-book HTML (`<host>.brand.html`) for every run. `formatBrandBook` is shared between the CLI and the website's `lib/build-files.js`, so the web demo and the CLI now produce identical output.

Other

• Fixed the README so the logo and the \"designlang in action\" image render on the npm package page (relative paths swapped for absolute `raw.githubusercontent.com` URLs). This is the one real reason the version was bumped.
• Removed every decorative status dot from the website per design feedback. Status indicators are now typed text chips throughout.

Install

```bash npx designlang@latest stripe.com # extract everything npx designlang@latest brand stripe.com --pdf # 13-chapter brand-book PDF ```

No code changes to the CLI vs v12.11.0 — upgrading is optional unless you want the corrected README to render on npm.

Links

• Live site: https://designlang.app
• Try it: https://designlang.app/#extract
• Gallery: https://designlang.app/gallery
• CHANGELOG: [CHANGELOG.md](https://github.com/Manavarya09/design-extract/blob/main/CHANGELOG.md#12120

🤖 Built with Claude Code.