Icon ✓ Stable

Copy page

Copy content for LLMs View as Markdown          Open in Claude Open in ChatGPT

import { IconBasketAddTo } from "@kesko/iconography/react";

export default () => (
  <IconBasketAddTo size="xl" />
);

import { Button, Stack } from "@kesko/components";
import { IconBasketAddTo, IconExternalLink } from "@kesko/iconography/react";

export default () => (
  <Stack direction="row" gap="2xs" align="center" wrap>
    <Button variant="primary">
      <IconBasketAddTo /> Primary
    </Button>
    <Button variant="primary" iconOnly>
      <IconBasketAddTo label="Add to basket" />
    </Button>
    <Button>
      Default <IconExternalLink />
    </Button>
    <Button disabled>
      Disabled <IconExternalLink />
    </Button>
    <Button variant="plain">
      <IconBasketAddTo /> Plain
    </Button>
    <Button variant="text">
      <IconBasketAddTo /> Text
    </Button>
  </Stack>
);

import { IconBasketAddTo } from "@kesko/iconography/react";

export default () => (
  <IconBasketAddTo color="var(--k-color-accent)" size="xl" />
);

import { Button } from "@kesko/components";
import { IconBasketAddTo } from "@kesko/iconography/react";

export default () => (
  <Button variant="primary" iconOnly>
    <IconBasketAddTo label="Add to basket" size="xl" />
  </Button>
);

import { Stack } from "@kesko/components";
import { IconBasketAddTo } from "@kesko/iconography/react";

export default () => (
  <Stack direction="row" align="center">
    <IconBasketAddTo size="xs" />
    <IconBasketAddTo size="sm" />
    <IconBasketAddTo size="md" />
    <IconBasketAddTo size="lg" />
    <IconBasketAddTo size="xl" />
  </Stack>
);