Marker
A compact inline marker for labeling content, with an optional icon and separator style.
Switched to a new branch
Thinking...
Conversation compacted
Explored 4 files
Installation
npx shadcn-vue@latest add https://vuedocs.canceydejean.dev/r/marker.jsonUsage
Use Marker for small metadata labels — timestamps, statuses, or section dividers. Pass
variant="separator" to draw flanking rules on either side of the content (useful for "OR" dividers),
or variant="border" for a simple bottom-bordered label row.
<script setup lang="ts">
import { Marker, MarkerContent, MarkerIcon } from "@/components/ui/marker";
import { Icon } from "@/components/ui/icons";
</script>
<template>
<Marker variant="separator">
<MarkerIcon>
<Icon icon="check" />
</MarkerIcon>
<MarkerContent>Verified</MarkerContent>
</Marker>
</template>