components

InKCre's avatarfrom InKCre

Use @inkcre/web-design Vue 3 components. Includes all 19 components with props, events, and usage examples.

⭐0stars🔀0forks📁View on GitHub🕐Updated Jan 1, 2026
[Code Generation]

When & Why to Use This Skill

The @inkcre/web-design Claude skill is a comprehensive developer resource for the Vue 3 component library. It enables AI agents and developers to rapidly build modern web interfaces by providing detailed documentation, props, events, and usage examples for over 20 specialized UI components, including advanced forms, editors, and layout elements.

Use Cases

  • Rapid UI Prototyping: Quickly scaffold Vue 3 applications using pre-built components like inkButton, inkHeader, and inkDialog to reduce development time.
  • Complex Form Implementation: Streamline data collection workflows by utilizing inkAutoForm and inkField for consistent and validated user inputs.
  • Specialized Data Interaction: Enhance user experience with advanced input tools such as inkJsonEditor, inkDatetimePickerView, and inkPicker for complex data types.
  • UI Consistency and Design Systems: Maintain a unified visual language across web projects by leveraging a standardized set of design-system-compliant components.
namecomponents
descriptionUse @inkcre/web-design Vue 3 components. Includes all 22 components with props, events, and usage examples.

@inkcre/web-design Components

Use this skill when working with the @inkcre/web-design Vue 3 component library.

Overview

@inkcre/web-design provides 21 UI components for Vue 3 applications:

Installation

npm install @inkcre/web-design
# or
pnpm add @inkcre/web-design

Setup

// main.ts
import { createApp } from 'vue'
import InKCreWebDesign from '@inkcre/web-design'
import "@inkcre/web-design/styles"

const app = createApp(App)
app.use(InKCreWebDesign)

Component References

Each component has detailed documentation in the references/ directory:

  • inkAutoForm - Component with props, events, and examples
  • inkButton - Component with props, events, and examples
  • inkDatetimePickerView - Component with props, events, and examples
  • inkDialog - Component with props, events, and examples
  • inkDoubleCheck - Component with props, events, and examples
  • inkDropdown - Component with props, events, and examples
  • inkField - Component with props, events, and examples
  • inkForm - Component with props, events, and examples
  • inkHeader - Component with props, events, and examples
  • inkImage - Component with props, events, and examples
  • inkInput - Component with props, events, and examples
  • inkJsonEditor - Component with props, events, and examples
  • inkLoading - Component with props, events, and examples
  • inkOverlay - Component with props, events, and examples
  • inkPagination - Component with props, events, and examples
  • inkPicker - Component with props, events, and examples
  • inkPlaceholder - Component with props, events, and examples
  • inkPopup - Component with props, events, and examples
  • inkScrim - Component with props, events, and examples
  • inkSwitch - Component with props, events, and examples
  • inkTextarea - Component with props, events, and examples
  • inkTooltip - Component with props, events, and examples