# Badge Tag

A pill that pairs a version tag with a short announcement.

## When to use

* Announce a release or a new feature above a hero heading.
* Pair a short label with one line of text.

## How it works

`BadgeTag` takes no props: the tag ("Version 7.8") and the text are fixed in the markup. It is plain markup with Tailwind classes and has no dependencies.

## Example

```tsx
import { BadgeTag } from "@/proprietary-components/badge-tag";

export default function DemoOne() {
  return <BadgeTag />;
}

```

## Code

Copy the component into your project:

```tsx
"use client";

import React from "react";


export function BadgeTag() {
    return (
        <div className="flex items-center space-x-2.5 border border-gray-500/30 rounded-full bg-gray-500/10 p-1 text-sm text-gray-800">
            <div className="bg-white border border-gray-500/30 rounded-2xl px-3 py-1">
                <p>Version 7.8</p>
            </div>
            <p className="pr-3">New feature is ready to use, let's try</p>
        </div>
    );
};

```