A lightweight JavaScript/TypeScript utility for seamless color manipulation and conversion. Tailwind CSS support is built-in.
Visit the playground to try out the library.
See the documentation for the library
Supported Formats - HEX, RGB, HSL, RGBA, HSLA, Tailwind CSS
- Color Conversion: Convert colors between all the supported formats.
- Brightness Control: Lighten or darken a color by a specified percentage.
- Random Color Generation: Generate random colors in of the supported format.
- Opacity Control: Set the opacity of color in any format.
- Blend Colors: Blend two colors in any format together in a specified ratio.
More features coming soon!
- Support for HSLA and RGBA formats
- New utility functions for opacity control and color blending
- Optimized codebase for better performance and reduced bundle size
Installation: Install PigmentTS via npm
npm install pigment-tsUsage
Import all the function you need
import { convertColor, lightenColor, toTailwind } from "pigment-ts";
// Convert HEX to RGB
const rgb = convertColor("#ff5733", "rgb");
console.log(rgb); // 'rgb(255, 87, 51)'
// Lighten a color by 20%
const lighter = lightenColor("#ff5733", 20);
console.log(lighter); // '#FF8A66'
// Get Tailwind CSS class
const twClass = toTailwind("#ef4343");
console.log(twClass); // 'red-500'Use all functions via default import
import PigmentTS from "pigment-ts";
const randomHex = PigmentTS.randomColor("hex");
console.log(randomHex); // '#A1B2C3'See the ROADMAP file for a list of features that are planned for future releases.
This project is licensed under the MIT License - see the LICENSE file for details.
See the CONTRIBUTING file for more information on how to contribute to this project.
Support me by giving a ⭐ if you find this project useful!