Instalación

Requisitos previos

• Uno de Vue 3 (v3.4+), React (v18+), Preact (v10.19+), Svelte (v5.29+) o Angular (v21.2+)
• Node.js (v18+) o Bun

Paquetes

Paquete	Descripción
urcolor	El motor de color por separado, con nombre sin ámbito. Reexporta @urcolor/core
@urcolor/core	Lógica de color y utilidades de accesibilidad
@urcolor/shared	Comportamiento agnóstico del framework, renderizado WebGL y muestreadores de cuadrícula, compartidos por todos los bindings
@urcolor/vue	Componentes y composables de Vue 3
@urcolor/react	Componentes y hooks de React
@urcolor/preact	Los componentes y hooks de React, compilados contra preact/compat
@urcolor/svelte	Componentes de Svelte 5 y hooks con runes
@urcolor/angular	Directivas de Angular y stores de signals
@urcolor/relative	Sintaxis opcional de colores relativos de CSS Color 5
@urcolor/i18n	Nombres de color y etiquetas de canal multilingües

Instalar

Vue

bun

bun add @urcolor/vue

npm

npm install @urcolor/vue

pnpm

pnpm add @urcolor/vue

yarn

yarn add @urcolor/vue

React

bun

bun add @urcolor/react

npm

npm install @urcolor/react

pnpm

pnpm add @urcolor/react

yarn

yarn add @urcolor/react

Preact

bun

bun add @urcolor/preact

npm

npm install @urcolor/preact

pnpm

pnpm add @urcolor/preact

yarn

yarn add @urcolor/preact

Svelte

bun

bun add @urcolor/svelte

npm

npm install @urcolor/svelte

pnpm

pnpm add @urcolor/svelte

yarn

yarn add @urcolor/svelte

Angular

bun

bun add @urcolor/angular

npm

npm install @urcolor/angular

pnpm

pnpm add @urcolor/angular

yarn

yarn add @urcolor/angular

Todos los paquetes de framework dependen de @urcolor/core y @urcolor/shared, así que ambos vienen incluidos. El paquete de Vue arrastra además Reka UI y el de React Base UI; los paquetes de Svelte y Angular no tienen más dependencias en tiempo de ejecución.

Solo el núcleo

Si solo necesitas las utilidades de color, sin binding de framework, instala urcolor, el nombre sin ámbito del mismo motor:

bun

bun add urcolor

npm

npm install urcolor

pnpm

pnpm add urcolor

yarn

yarn add urcolor

import { Color } from "urcolor";

urcolor no tiene código propio: reexporta @urcolor/core y depende de él con el mismo rango que los paquetes de framework, así que obtienes una sola copia del motor y una sola clase Color. Usa el nombre que prefieras: @urcolor/core ya está presente si instalaste un binding, y mezclar ambos nombres en un proyecto es seguro.

Paquetes opcionales

@urcolor/relative añade la sintaxis de colores relativos de CSS Color 5 y @urcolor/i18n añade nombres de color multilingües:

bun

bun add @urcolor/relative @urcolor/i18n

npm

npm install @urcolor/relative @urcolor/i18n

pnpm

pnpm add @urcolor/relative @urcolor/i18n

yarn

yarn add @urcolor/relative @urcolor/i18n