13:I[28161,["19418","static/chunks/19418-ab1fd6ae0536ae09.js?dpl=dpl_CkG1hHq9bVdHju4wmK2ny6Rqth8i","4794","static/chunks/4794-816ac95d98137d97.js?dpl=dpl_CkG1hHq9bVdHju4wmK2ny6Rqth8i","10632","static/chunks/10632-45a2a7dcf9530ad3.js?dpl=dpl_CkG1hHq9bVdHju4wmK2ny6Rqth8i","96916","static/chunks/96916-0397e9a74ad2f049.js?dpl=dpl_CkG1hHq9bVdHju4wmK2ny6Rqth8i","28439","static/chunks/28439-bc60bdfeaea6922d.js?dpl=dpl_CkG1hHq9bVdHju4wmK2ny6Rqth8i","33602","static/chunks/app/tools/%5Bslug%5D/page-a3e8d99d57d3e6d1.js?dpl=dpl_CkG1hHq9bVdHju4wmK2ny6Rqth8i"],"default"] 14:T605,import React, { useState } from 'react'; const ColorConverter = () => { const [color, setColor] = useState(''); const [result, setResult] = useState(null); const [loading, setLoading] = useState(false); const convertColor = async () => { setLoading(true); try { const response = await fetch('/api/utilities/color-format-converter/v1', { method: 'POST', headers: { 'Content-Type': 'application/json', 'Authorization': 'Bearer YOUR_API_KEY' }, body: JSON.stringify({ color }) }); const data = await response.json(); if (data.success) { setResult(data.data); } else { console.error('Conversion failed:', data.error); } } catch (error) { console.error('API Error:', error); } finally { setLoading(false); } }; return (

setColor(e.target.value)} placeholder="Enter color (e.g., #FF5733, red, rgb(255,87,51))" /> {result && (

Conversion Results:

HEX: {result.conversions?.hex}

RGB: {result.conversions?.rgb}

HSL: {result.conversions?.hsl}

CMYK: {result.conversions?.cmyk}

Color Format Converter

Try it live

About this API

Endpoint

Methods

Category