ForHosting KIT · Strumenti per sviluppatori

HSL in stringa CSS

Trasformi valori separati di tonalità, saturazione e luminosità in una stringa CSS hsl() pulita, senza comporre la punteggiatura a mano, applicare arrotondamenti incoerenti o dimenticare le percentuali.

● BetaGratis · nel tuo browser

Esegui gratis nel browser Vedi l'API

Usalo da WebAPIEmailTelegramApp presto

Il formattatore convalida ogni componente, normalizza la tonalità sul cerchio cromatico, arrotonda secondo la precisione scelta e restituisce un risultato prevedibile. È utile ovunque dati colore strutturati debbano diventare CSS pronto per il browser, dalle pipeline di token e dai generatori di temi fino a test automatizzati, modelli e piccoli strumenti di sviluppo.

Fornisca componenti HSL numerici

Invii tonalità, saturazione e luminosità come numeri JSON, non come espressione CSS parzialmente formattata. La tonalità è un angolo in gradi e può essere positiva, negativa o maggiore di un giro completo. Il formattatore la riporta nell’intervallo canonico che inizia da zero e termina prima di 360: -30 equivale a 330 e 390 diventa 30. Saturazione e luminosità rappresentano percentuali, ma si inseriscono senza simbolo: usi 65 per sessantacinque per cento. Entrambe devono rimanere tra 0 e 100. Ogni valore obbligatorio deve essere un numero finito; stringhe come «50», campi mancanti, null, Infinity e NaN vengono rifiutati per evidenziare gli errori e garantire risultati identici in API, browser e test.

Controlli un arrotondamento deterministico

Usi precision per scegliere il numero massimo di cifre decimali conservate nei tre componenti. Il valore predefinito è due e sono ammessi interi da zero a sei. Zero produce componenti interi; valori maggiori mantengono più dettaglio. L’arrotondamento avviene dopo la normalizzazione della tonalità. Gli zeri finali superflui vengono rimossi e lo zero negativo diventa zero. Le regole non dipendono dalle impostazioni locali: il separatore decimale è sempre un punto, gli argomenti usano una virgola seguita da spazio e le percentuali ricevono sempre il proprio simbolo. La stessa entrata valida restituisce quindi una stringa identica in qualunque ambiente.

Utilizzi in sicurezza il CSS restituito

Il risultato contiene un campo css nella notazione hsl(h, s%, l%). Può inserirlo in una dichiarazione di stile, una proprietà DOM, un token grafico o un test golden. La capacità esegue solo la formattazione: non converte RGB o esadecimale, non aggiunge trasparenza alfa, non calcola il contrasto e non valuta la leggibilità. Per generare temi, convalidi prima i record e formatti ogni colore separatamente, così ogni errore resta identificabile. Se la precisione appartiene a una convenzione pubblica, la specifichi esplicitamente. Ogni richiesta automatizzata costa $0.002. Inserisca la stringa solo dove è previsto un valore colore CSS.

Casi d'uso

Generare token grafici

Converta record HSL calcolati in valori CSS uniformi prima di scrivere variabili di tema o file di token.

Normalizzare un modulo

Convalidi i numeri di un selettore colore e produca una stringa stabile per anteprime, archiviazione o stili.

Creare test stabili

Applichi arrotondamento e spaziatura fissi per evitare variazioni negli snapshot dovute alla formattazione.

Domande frequenti

Quanto costa una richiesta?

Il prezzo base dell’API è $0.002 per richiesta.

L’input include i simboli di percentuale?

No. Invii numeri da 0 a 100; il formattatore aggiunge i simboli necessari.

Che cosa accade a una tonalità fuori da 0 a 360?

Viene riportata sul cerchio cromatico nell’intervallo da 0 fino a prima di 360.

Quante cifre decimali posso mantenere?

Imposti precision su un intero da 0 a 6. Il valore predefinito è 2 e gli zeri finali vengono rimossi.

È supportata la trasparenza alfa?

No. Viene prodotta una stringa hsl() opaca a tre componenti, senza componente alfa.

Per sviluppatori — accesso via API

Tutto quello che vedi in questa pagina è disponibile anche via API. Questa sezione è per i team che vogliono integrarlo nei propri sistemi; chi non ne ha bisogno può semplicemente usare lo strumento qui sopra.

Endpoint

POSThttps://api.kit.forhosting.com/color/hsl-to-css

Autenticazione con Bearer token: un POST mette in coda l'attività e il risultato arriva via webhook o link firmato.

Chiamala dal tuo stack

curl -X POST https://api.kit.forhosting.com/color/hsl-to-css \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"hue":210.456,"saturation":64.444,"lightness":42.225}'

const res = await fetch("https://api.kit.forhosting.com/color/hsl-to-css", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "hue": 210.456,
    "saturation": 64.444,
    "lightness": 42.225
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/color/hsl-to-css",
    headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
    json={
    "hue": 210.456,
    "saturation": 64.444,
    "lightness": 42.225
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/hsl-to-css", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => '{"hue":210.456,"saturation":64.444,"lightness":42.225}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"hue":210.456,"saturation":64.444,"lightness":42.225}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/hsl-to-css", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

Esempio di richiesta

{
  "hue": 210.456,
  "saturation": 64.444,
  "lightness": 42.225
}

Esempio di risposta

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "color.hsl_to_css",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

L'API è asincrona: ricevi subito un task_id e puoi fare polling fino a 1 richiesta al secondo.

Prezzi

per richiesta$0.002

Prezzo pubblicato, senza token né crediti. Se l'attività fallisce, non paghi.

Errori

HTTP	Codice	Significato
`401`	`unauthorized`	Chiave API mancante o non valida: controlla l'header Authorization.
`402`	`insufficient_balance`	Credito esaurito: ricarica per continuare a eseguire attività.
`404`	`unknown_type`	Tipo di attività sconosciuto: controlla il campo type della richiesta.
`429`	`rate_limited`	Troppe richieste in poco tempo: rallenta e riprova tra qualche secondo.

Leggi la documentazione completa del KIT →