Skip to content
Velkin LogoVelkin Logo
Velkin
VELKIN/UI

Modern UI components for product teams and their AI agents. Lit core, typed wrappers, live MCP.

sales@velkinui.com

Product

  • Docs
  • Components
  • Studio
  • Pricing

Resources

  • Quick start
  • Blog
  • Changelog
  • Roadmap
  • Status

Project

  • About
  • Contact
  • License
  • Privacy
  • Terms

© 2026 Velkin. MIT core · Pro licenses available.

VELKIN

Image

An image component with responsive srcset and optional auto sizes.

vu-image · @velkin/react/image

Copy page

Import

React
npm i @velkin/react

import { VuImage } from "@velkin/react/image";

Examples

API

Props

PropTypeDefaultDescription
srcstring""Primary image source URL.
altstring""Alternative text; empty marks decorative.
srcsetstring""Responsive source set string.
sizesstring""Responsive sizes string.
autoSizesbooleanfalseComputes `sizes` from host width (`autosizes` attr). Default: `false`.
fitVuImageFit"cover"Object-fit preset. Default: `"cover"`.
loadingVuImageLoading"lazy"Native loading hint. Default: `"lazy"`.
decodingVuImageDecoding"async"Native decoding hint. Default: `"async"`.

CSS parts

PartDescription
imgThe underlying `<img>` element.
placeholderEmpty-state block when `src` is blank.

Types

NameDefinition
VuImageDecoding
"auto" | "async" | "sync"
VuImageFit
"none" | "cover" | "contain" | "fill" | "scale-down"
VuImageLoading
"lazy" | "eager"

Related

Data display

  • AvatarAn avatar component with image, initials, icon, or custom content.
  • Avatar GroupAn avatar group component that stacks overlapping avatars.
  • BadgeA badge component for counts, status dots, and overlay marks.
  • ChipA chip component for tags and filters with dismiss or toggle actions.
  • Data TableA data table component with sorting, filtering, and selection.
  • DividerA divider component for horizontal or vertical layout separation.

Guides

  • AppearanceShared visual props
  • EventsSelection and change events

Browse

  • Previous: IconEarlier in the sidebar
  • Next: KanbanLater in the sidebar
  • All componentsBrowse the full index