"Made with Ink Web" Badge

Want to show off that your site uses Ink Web? Add one of these badges.

Installation

npx shadcn@latest add https://raw.githubusercontent.com/cjroth/ink-web/main/packages/ink-ui/registry/made-with-ink-web.json

npx shadcn@latest add https://raw.githubusercontent.com/cjroth/ink-web/main/packages/ink-ui/registry/made-with-ink-web.json

pnpm dlx shadcn@latest add https://raw.githubusercontent.com/cjroth/ink-web/main/packages/ink-ui/registry/made-with-ink-web.json

bunx shadcn@latest add https://raw.githubusercontent.com/cjroth/ink-web/main/packages/ink-ui/registry/made-with-ink-web.json

Corner Ribbon

A ribbon that sits in the corner of the page. Great for dev builds or project showcases.

made with ink web

your page content

import { CornerRibbon } from '@/components/ui/made-with-ink-web'

// Add to your root layout
export default function Layout({ children }) {
  return (
    <>
      {children}
      <CornerRibbon />
    </>
  )
}

Props

Prop	Type	Default	Description
`position`	`"top-right" \| "top-left" \| "bottom-right" \| "bottom-left"`	`"top-right"`	Which corner
`className`	`string`	-	Additional CSS classes
`absolute`	`boolean`	`false`	Use absolute instead of fixed positioning

Positions

top-left

top-right

bottom-left

bottom-right

Badge Button

An inline button-style badge. Works in footers, sidebars, or anywhere else.

>_made with ink web >_made with ink web >_made with ink web

import { BadgeButton } from '@/components/ui/made-with-ink-web'

<BadgeButton />              // dark (default)
<BadgeButton variant="light" />
<BadgeButton variant="outline" />

Props

Prop	Type	Default	Description
`variant`	`"dark" \| "light" \| "outline"`	`"dark"`	Visual style
`className`	`string`	-	Additional CSS classes

Text Badge

A minimal text link, perfect for footers or subtle attribution.

>_ made with ink web

import { TextBadge } from '@/components/ui/made-with-ink-web'

<footer>
  <TextBadge />
</footer>

Props

Prop	Type	Default	Description
`className`	`string`	-	Additional CSS classes

"Made with Ink Web" Badge

On this page