Link - DevReady Kit

Overview

The Link component provides styled links with hover effects, external link indicators, and disabled states.

Basic Usage

Code
Preview

import { Link } from '@peppermint-design/devreadykit-custom';

export default function LinkBasic() {
  return (
    <Link href="/about">
      Learn more
    </Link>
  );
}

External Link

Code
Preview

import { Link } from '@peppermint-design/devreadykit-custom';

<Link href="https://example.com">
  Visit external site
</Link>

Hide Icon

Code
Preview

import { Link } from '@peppermint-design/devreadykit-custom';

<Link href="/page" hideIcon>
  Internal link without icon
</Link>

Disabled

Code
Preview

import { Link } from '@peppermint-design/devreadykit-custom';

<Link href="/page" disabled>
  Disabled link
</Link>

Props