Tweet to Code

📝 Overview

Tweet to Code is an design-to-code registry that I transform tweet designs i find into ready-to-use, customizable React components. Seamlessly integrate any of these designs into your projects with just a few commands.

✨ Features

• 🎨 Curated UI component designs from tweet designers
• 🔧 Fully compatible with shadcn/ui ecosystem
• 💻 Responsive and accessible components
• 🌓 Built-in light/dark theme support
• 🚀 Easy, CLI-based installation

🛠 Technologies

🚀 Quick Start

We use the exact same installation process and cli from: shadcn/ui

Installation

Install components directly from our registry:

# Generic component installation
npx shadcn@latest add "https://tweet-to-code.vercel.app/r/ui/component-name.json"

# Example: Sherlock Hero Component
npx shadcn@latest add "https://tweet-to-code.vercel.app/r/ui/sherlock-hero.json"

Usage Example

import { SherlockHero } from "@/components/ui/sherlock-hero"

export default function HomePage() {
  return <SherlockHero />
}

🤝 Design Attribution

All designs are attributed to their original creators.

🚨 Disclaimer

If you are a design owner and wish to have a design removed, please:

• Open an Issue
• Contact via X (Twitter)

📄 License

• Repository: MIT License
• Design Ownership: Remains with original creators

---

Built with ❤️ by Bankk