StyleSeed – AI coding tools में डिज़ाइन समझ भरने वाला open source (2,200 लाइनों के design rules)

 (github.com/bitjaru)
26 पॉइंट द्वारा bitjaru0402 2026-04-07 | 4 टिप्पणियां | WhatsApp पर शेयर करें

Vibe coding से UI बनाते समय अक्सर "फ़ंक्शन काम करता है, लेकिन डिज़ाइन खराब दिखता है" जैसी समस्या आती है.

StyleSeed एक open source है जो AI coding tools (Claude Code आदि) में design rules भर देता है. प्रोजेक्ट में फ़ाइल कॉपी करते ही AI, Toss app स्तर का UI बना देता है.

शामिल सामग्री:

  • 2,200 लाइनों के visual design rules के 60 सेट (color philosophy, typography hierarchy, card structure, forbidden patterns आदि)
  • 47 React components (shadcn/ui आधारित 31 + dashboard patterns 16)
  • 10 Claude Code skills (UI generation, UX audit, microcopy generation आदि)
  • Tailwind CSS v4 theme (light/dark mode)

अगर awesome-design-md(23K stars) का DESIGN.md brand tokens देता है, तो StyleSeed एक "design brain" है, जिसमें layout rules, UX guide, और components तक शामिल हैं.

पहला seed Toss style है. Apple, Linear, Stripe seeds बाद में जोड़े जाने की योजना है. MIT license.

संबंधित पढ़ाई

4 टिप्पणियां

 
bitjaru0402 2026-04-13

▎ अपडेट है — मैंने एक clickable live demo अपलोड किया है। ▎
▎ 🎬 https://styleseed-demo.vercel.app ▎
▎ यह वही स्क्रीन है जिसमें एक ही chat UI को Toss → Raycast → Arc इन तीन brands में एक साथ morph किया जाता है। रंग, roundness, motion, shadow और gradient सब कुछ सिर्फ एक data-skin property से बदल जाता है। बिना code branching के, सिर्फ tokens से। ▎
▎ README के सबसे ऊपर GIF preview जोड़ दिया है: https://github.com/bitjaru/styleseed ▎
▎ पहली पोस्ट पर राय देने वाले सभी लोगों का धन्यवाद 🙏
 
kurthong 2026-04-08

ओपन सोर्स के ज़रिए डोमेन ज्ञान का विस्तार होना विडंबना यह है कि बड़े AI युग में और भी चमकता हुआ लगता है। इतनी शानदार ज्ञान-साझा करने के लिए धन्यवाद!
 
aldlfkahs 2026-04-08

शेयर करने के लिए धन्यवाद। पर्सनल प्रोजेक्ट करते समय यह काफ़ी काम आएगा।
 
kaydash 2026-04-07

कमाल है!