Beautiful Code Fragments for Your Next Project

A curated collection of beautiful, reusable code fragments for modern web development. Copy and paste into your projects.

HTML & CSS

Beautiful layouts and styling patterns

24 fragments

Tailwind Components

Pre-built Tailwind CSS components

36 fragments

React Components

Reusable React component patterns

18 fragments

Code Templates

Ready-to-use code templates

12 fragments

Featured Fragments

Responsive Navigation Bar

A modern navigation bar with mobile menu and dark mode support

export function Navbar() {
  return (
    <nav className="flex items-center justify-between p-4">
      <Logo />
      <div className="hidden md:flex items-center gap-6">
        <NavLinks />
        <ThemeToggle />
      </div>
      <MobileMenu className="md:hidden" />
    </nav>
  );
}

Grid Card Layout

Responsive grid layout with beautiful cards

export function GridLayout({ items }) {
              return (
                <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                  {items.map((item) => (
                    <Card key={item.id} className="p-4">
                      <CardContent {...item} />
                    </Card>
                  ))}
                </div>
              );
            }