Extraire un canal couleur
Obtenez un seul nombre à partir d’une couleur plutôt qu’une conversion complète : le rouge de #3498db vaut 52 et la transparence de #3498db80 vaut 128, sur la même échelle de 0 à 255. Gratuit dans votre navigateur.
- Gratuit
- Fonctionne dans votre navigateur
- Sans inscription
- Vos données restent sur votre appareil
Lancer gratuitement
Exemple résolu
- Couleur
- #3498db
- Canal
- Red
- Valeur
- 52
- Red
- 52
- Vert
- 152
- Bleu
- 219
Les systèmes de design, les remplissages de canevas, les uniforms d'un shader et les contrôles de contraste d'accessibilité ont souvent besoin d'un seul nombre issu d'une couleur, pas d'une table de conversion complète. Vous détenez déjà un jeton hex tel que #3498db ou un octolet #3498db80, ou une chaîne CSS rgb() ou rgba(), et vous voulez le canal rouge, vert, bleu ou alpha comme entier sur l'échelle 0–255. Cette capacité extrait le canal nommé : elle valide la chaîne de couleur et le nom du canal, puis renvoie ce nombre de façon déterministe. Les outils frères qui convertissent l'hex en un triplet RGB complet vous laissent encore choisir un champ ; cette page est l'extracteur dédié aux pipelines qui demandent une seule bande.
Ce qu'est un canal couleur et comment le nombre est dérivé
Une couleur numérique à l'écran est presque toujours quatre canaux de huit bits empaquetés : rouge, vert, bleu et une bande alpha facultative (opacité). Dans la forme hex à six chiffres #RRGGBB, la première paire est le rouge, celle du milieu le vert et la dernière le bleu ; chaque paire se lit comme un entier en base seize de 00 (zéro) à FF (deux cent cinquante-cinq).
Les formes à quatre et huit chiffres #RGBA et #RRGGBBAA ajoutent une paire alpha sur cette même échelle 0–255, c'est pourquoi un jeton tel que #3498db80 n'est pas la même couleur que #3498db : la paire extra est de la transparence, pas une quatrième teinte. CSS rgb() écrit ces trois entiers en décimal ; rgba() ajoute une unité alpha dans l'intervalle unitaire de zéro à un, et ce solveur multiplie cette unité par 255 puis arrondit à l'entier le plus proche afin que chaque canal extrait partage une même échelle.
L'abréviation hex à trois et quatre chiffres double chaque nibble : #f00c devient #ff0000cc avant toute lecture de canal. Extraire un canal nommé est alors une lecture après cette analyse : l'entier rouge, vert, bleu ou alpha, non une conversion vers HSL, LAB ou CMYK. L'algorithme est de l'arithmétique pure et de la validation de chaînes.
Où extraire un seul canal justifie son existence
Les tests d'interface qui affirment le canal rouge d'un jeton de marque, les chargeurs de shader qui lient un seul uniform et les audits de tableur qui comparent seulement l'alpha d'une incrustation veulent un nombre, pas un convertisseur à trois champs à déballer. Les pipelines de jeu et d'impression qui rédigent du #RRGGBBAA ont besoin d'échouer clairement lorsqu'on saisit hue ou saturation dans le champ channel au lieu de renvoyer NaN en silence.
Préférez cette capacité lorsque l'intention de recherche est extraire un canal couleur — obtenir rouge, vert, bleu ou alpha comme nombre. Ce n'est pas une page hex-vers-RGB, ni un extracteur de palette depuis des photos, ni un mélangeur, ni une table de couleurs CSS nommées. Gardez les requêtes courtes, figez value et la couleur normalisée dans les tests, et vous obtenez un entier reproductible pour tickets, greffons LMS et workers de bord sans dresser une bibliothèque de gestion des couleurs.
Cas d’usage
Uniforms de shader et de canevas
Liez un seul canal 0–255 depuis un jeton hex ou rgba() à un uniform WebGL, un aide de remplissage Canvas ou un pipeline de propriétés personnalisées CSS.
Audits d'alpha sur les incrustations
Lisez l'alpha rédigé des incrustations #RRGGBBAA ou rgba() et refusez les jetons qui ont perdu la transparence en silence ou utilisé un nom de canal inconnu.
Questions fréquentes
Quels canaux pouvez-vous extraire d'une couleur ?
Exactement quatre canaux nommés : red, green, blue et alpha. Chacun est renvoyé comme entier de 0 à 255 dans le champ value.
Quels formats de couleur l'extraction de canal accepte-t-elle ?
Hex #RGB, #RGBA, #RRGGBB et #RRGGBBAA avec ou sans # initial, plus CSS rgb(r, g, b) et rgba(r, g, b, a). Les couleurs CSS nommées et les préfixes 0x ne sont pas acceptés.
Comment l'alpha est-il converti depuis rgba() versus l'hex à huit chiffres ?
L'alpha hex est déjà en 0–255 (par exemple #80 vaut 128). L'alpha de rgba() est une unité de 0 à 1 et se convertit avec round(alpha × 255), donc 0.5 devient 128 sur la même échelle.
Que se passe-t-il si vous demandez l'alpha d'une couleur qui n'en a pas ?
Cette valeur par défaut est documentée pour que vous distinguiez une bande omise d'un #ff ou d'un 1.0 rédigés.
Combien coûte l'extraction d'un canal couleur ?
L'outil du navigateur est gratuit. Une couleur ou un canal invalides ne sont pas facturés.
Outils associés
Pour les développeurs — accès API
Tout sur cette page est disponible par programmation. Cette section s'adresse aux équipes qui veulent l'intégrer à leurs systèmes ; les autres peuvent simplement utiliser l'outil ci-dessus.
Endpoint
Authentification par jeton Bearer : un seul POST met la tâche en file d’attente, et le résultat vous parvient par webhook ou lien signé.
Appeler depuis votre stack
curl -X POST https://api.kit.forhosting.com/color/channel-extract \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"color":"#3498db","channel":"red"}'const res = await fetch("https://api.kit.forhosting.com/color/channel-extract", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"color": "#3498db",
"channel": "red"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/channel-extract",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"color": "#3498db",
"channel": "red"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/channel-extract", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"color":"#3498db","channel":"red"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"color":"#3498db","channel":"red"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/channel-extract", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Exemple de requête
{
"color": "#3498db",
"channel": "red"
}Exemple de réponse
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.channel_extract",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}L’API est asynchrone : chaque appel renvoie un task_id immédiatement, puis vous interrogez l’état à raison d’une requête par seconde.
Tarifs
Le prix est publié, sans tokens ni crédits. Une tâche qui échoue n’est pas facturée.
Limites
max_color_chars | 64 |
Erreurs
| HTTP | Code | Signification |
|---|---|---|
401 | unauthorized | Clé API absente ou invalide : vérifiez l’en-tête Authorization. |
402 | insufficient_balance | Solde insuffisant : rechargez votre compte pour lancer cette tâche. |
404 | unknown_type | Type de tâche inconnu : vérifiez le champ type de votre requête. |
429 | rate_limited | Trop de requêtes : ralentissez la cadence, puis réessayez. |
Notes techniques
Les couleurs invalides et les noms de canal inconnus échouent avec invalid_input et ne sont pas facturés.
Ce qu'est un canal couleur et comment le nombre est dérivé
Lorsqu'une couleur omet l'alpha, l'extracteur traite la bande manquante comme pleinement opaque 255 plutôt que d'inventer un trou, et pose had_alpha à false pour que l'appelant distingue une valeur par défaut d'une transparence rédigée.
Contrat d'entrée, formats acceptés et forme de la réponse
Les composantes RGB en notation fonctionnelle vont de 0–255 ; l'alpha de rgba() est 0–1 inclus et se convertit avec round(alpha × 255). La chaîne color peut faire au plus 64 caractères après trim. Envoyez un corps JSON avec deux champs obligatoires. color est une chaîne : hex de trois, quatre, six ou huit chiffres et un dièse initial facultatif, ou une liste CSS rgb(r, g, b) / rgba(r, g, b, a). Les alias hex, value, text, input et colour sont acceptés pour le champ color. channel doit être l'un des noms fermés red, green, blue ou alpha (le solveur accepte les formes courtes r, g, b et a ; l'enum publié est les quatre mots complets afin que le formulaire web soit une liste, pas un piège de saisie libre). En cas de succès le corps renvoie value, l'entier extrait ; channel, le nom canonique ; color, un hex minuscule normalisé (#rrggbb lorsque l'alpha a été omis, #rrggbbaa lorsqu'il a été rédigé) ; les quatre entiers red, green, blue et alpha ; scale 255 ; source décrivant la forme analysée (hex3, hex4, hex6, hex8, rgb ou rgba) ; had_alpha ; et un court message. Exemple : color #3498db et channel red donne value 52 car parseInt de 34 en base seize vaut 52. Exemple : color #3498db80 et channel alpha donne value 128. Une validation échouée — champ manquant, chaîne vide, préfixe 0x, mauvaise longueur hex, caractères non hex, rgb() à mauvaise arité, alpha rgba() hors de 0–1, ou un canal inconnu tel que hue — renvoie invalid_input en nommant le champ et n'est jamais facturée.
Où extraire un seul canal justifie son existence
Parce que l'implémentation est du parse pur de niveau A, chaque appel réussi coûte le tarif de base publié $0.002 sans jetons de modèle et sans réseau sortant, et une validation échouée ne consomme pas le solde.
Cas d'intégration
Fixtures de jetons de design et de thème
Vérifiez qu'un hex de marque a toujours l'entier rouge, vert, bleu ou alpha attendu après un changement de feuille de style, sans déballer un convertisseur RGB complet à chaque test.