@paratus-medical/paratus-icons

Paratus Icons

A beautiful, customizable SVG icon library for Vue and Nuxt applications, featuring a collection of medical and UI icons with consistent styling.

Features

• 60+ carefully crafted SVG icons
• Non-scaling strokes for consistent line weights at any size
• Optimized for Vue 3 and Nuxt 3
• Stroke-based design with fill="none" by default
• Simple API with customizable size and color

Installation

# Install from GitHub
npm install @paratus-medical/paratus-icons

# With yarn
yarn add @paratus-medical/paratus-icons

Usage

Basic Usage

<template>
  <div>
    <ParatusIcon name="arrow-right" :size="24" color="blue" />
  </div>
</template>

<script setup>
import ParatusIcon from '@paratus-medical/paratus-icons';
</script>

Available Props

Available Icons

The library includes the following icons:

administration, adult, airway, algorithm, arrow-left, arrow-right, arrow-short-left, arrow-short-right, arrow-short-up, arrow-short-down, calendar, check, checklist, close-circle, close, compatibility, conditions, drugs, equipment, edit, expand, expand2, export, institution, forbiden, frame, gender, gift, graduation, heart, heart-plus, height, lungs, home, medical-pack, menu, neonatal, pack-equipment, paratus-glyph, peds, phone, place, plus, procedures, redo, reference, resuscitation, search, secure-check, secure, slides, star, star-active, user, vitals, warning, weight, weight-adjusted, weight-drug, weight-ideal, ultrasound

Styling

The icons are designed to be used with strokes only by default (fill="none"). You can customize the stroke color using the color prop.

<!-- Default (uses currentColor) -->
<ParatusIcon name="heart-outline" />

<!-- Custom color -->
<ParatusIcon name="heart-outline" color="#FF0000" />

<!-- Using Tailwind classes -->
<div class="text-blue-500">
  <ParatusIcon name="heart-outline" />
</div>

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT © Paratus Medical