List Checkmarks

Overview

VListCheckmarks displays a vertical list where each item is prefixed with a checkmark icon.

Props

NameTypeRequiredDescription
itemsstring[]trueItems to render with checkmarks.

When to use

  • Feature/benefit lists
  • Short, scannable statements where a success/complete metaphor works

Usage

vue
<script setup lang="ts">
import VListCheckmarks from 'UiKit/components/VList/VListCheckmarks.vue';
const items = ['Fast delivery', 'Secure payments', '24/7 support'];
</script>

<template>
  <VListCheckmarks :items="items" />
</template>
  • Fast delivery
  • Secure payments
  • 24/7 support

Appearance

  • Left-aligned checkmark icon before each item
  • Even vertical spacing, inherits page typography
Help Ukraine to stop russian aggression