ForHosting KIT · Images

Calculateur de zone de protection d’un logo

Traduisez une règle de marque comme 1,5 fois la hauteur d'x en distance exacte : un logo de 120 pixels avec un x de 24 demande 36 pixels libres de chaque côté, pour une hauteur protégée de 192. Gratuit dans votre navigateur.

Gratuit
Fonctionne dans votre navigateur
Sans inscription
Vos données restent sur votre appareil

Lancer gratuitement Voir l’API

Utilisez-le depuis WebAPIE-mailTelegramApp bientôt

Exemple résolu

Si vous saisissez

Hauteur du logo: 120 px
Hauteur de l'élément de référence: 24
Multiple de l'espace libre: 1,5

Vous obtenez

Espace libre minimal: 36 px
Hauteur protégée: 192
Référence en % de la hauteur du logo: 20

Une zone de protection préserve le logo des textes, images, bordures et bords de page trop proches. Ce calculateur convertit une règle telle que « conserver 1.5 fois la hauteur du x autour du logo » en une distance minimale précise. Saisissez la hauteur d’affichage du logo, celle de l’élément de référence et le multiple exigé. Le résultat conserve l’unité choisie, indique l’espace requis de chaque côté et donne la hauteur protégée totale lorsque cet espace est ajouté en haut et en bas.

Mesurez le logo et le repère à la même échelle

Commencez avec le logo à sa taille exacte dans la création. Mesurez sa hauteur, puis celle de l’élément cité dans la charte, sans redimensionner séparément l’illustration. La règle peut utiliser la hauteur d’un x minuscule, la hauteur d’une capitale, le diamètre du symbole ou un autre détail graphique.

Les deux valeurs doivent partager la même unité. Les pixels conviennent aux écrans ; l’unité générique permet de travailler en millimètres ou en points pour l’impression. Le calculateur ne convertit pas les unités, car une conversion masquerait une incohérence d’échelle : il conserve votre choix.

Pour un logo de 120 pixels dont le x mesure 24 pixels, saisissez directement ces valeurs. Privilégiez le fichier vectoriel d’origine ou une exportation nette. Un aperçu flou, une capture étirée ou un fichier entouré de transparence peut donner une mesure qui ne correspond pas au signe réellement visible.

Appliquez correctement le multiple de protection

Le multiple indique combien de hauteurs de référence doivent rester libres autour du logo. Une règle de 1x impose une hauteur de référence ; 1.5x la multiplie par 1.5 et 2x la double. Saisissez seulement le nombre : le calculateur effectue le produit et renvoie le minimum pour un côté.

Cette distance s’applique généralement en haut, en bas, à gauche et à droite, sauf consigne asymétrique explicite. La hauteur protégée ajoute deux fois cet espace à la hauteur du logo, une fois au-dessus et une fois au-dessous. Elle permet de vérifier si une bannière, une carte ou une barre de navigation est assez haute.

Le pourcentage du repère sert de contrôle : il indique la part du logo occupée par ce repère et peut révéler des mesures prises à des échelles différentes. Si la charte de la marque définit une autre méthode, ses instructions restent prioritaires.

Exploitez le résultat dans les maquettes et les livrables

Considérez le minimum comme une zone d’exclusion, et non comme un simple confort visuel. Aucun texte, dessin, cliché, filet, bord de coupe ou contrôle interactif ne doit y pénétrer. Dans votre logiciel de création, placez des guides ou un cadre invisible décalé de la distance calculée sur les quatre côtés.

Pour une mise en page adaptative, recommencez le calcul à chaque nouvelle taille du logo, sauf si le repère évolue automatiquement avec l’ensemble. En CSS, la valeur peut guider les marges ou le padding, mais le conteneur peut ajouter son propre espacement et le navigateur produire des fractions de pixel. Conservez les décimales si possible ; si seuls les pixels entiers sont admis, arrondissez vers le haut afin de ne jamais passer sous le minimum.

Notez la hauteur, le repère, le multiple, l’unité et le résultat pour rendre la décision reproductible.

Cas d’usage

Dimensionner un en-tête de site

Transformez la règle fondée sur la hauteur du x en marge précise avant de définir la navigation.

Préparer un document imprimé

Calculez la zone d’exclusion dans une unité commune pour éloigner textes et traits de coupe.

Contrôler des modèles graphiques

Produisez des valeurs reproductibles pour plusieurs tailles de logo dans les présentations et documents.

Questions fréquentes

Qu’est-ce que la zone de protection d’un logo ?

C’est l’espace vide minimal autour du signe, qui empêche les autres éléments de le serrer ou de le masquer.

Quel élément faut-il choisir comme référence ?

Utilisez celui désigné par la charte, par exemple la hauteur du x, une capitale ou une partie du symbole.

L’espace s’applique-t-il à tous les côtés ?

Le calcul fournit le minimum pour un côté. Reportez-le sur les quatre, sauf règle asymétrique explicite.

Puis-je employer une mesure autre que le pixel ?

Oui. Choisissez l’unité générique et saisissez toutes les mesures dans cette même unité, sans conversion.

Faut-il arrondir une fraction de pixel ?

Gardez la décimale si le système le permet. Sinon, arrondissez vers le haut pour respecter le minimum.

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

POSThttps://api.kit.forhosting.com/image/logo-clear-space-calc

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/image/logo-clear-space-calc \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"logo_height":120,"reference_element_height":24,"clear_space_multiple":1.5}'

const res = await fetch("https://api.kit.forhosting.com/image/logo-clear-space-calc", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "logo_height": 120,
    "reference_element_height": 24,
    "clear_space_multiple": 1.5
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/image/logo-clear-space-calc",
    headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
    json={
    "logo_height": 120,
    "reference_element_height": 24,
    "clear_space_multiple": 1.5
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/image/logo-clear-space-calc", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => '{"logo_height":120,"reference_element_height":24,"clear_space_multiple":1.5}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"logo_height":120,"reference_element_height":24,"clear_space_multiple":1.5}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/image/logo-clear-space-calc", 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

{
  "logo_height": 120,
  "reference_element_height": 24,
  "clear_space_multiple": 1.5
}

Exemple de réponse

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "image.logo_clear_space_calc",
  "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

par requête$0.002

Le prix est publié, sans tokens ni crédits. Une tâche qui échoue n’est pas facturée.

Limites

`max_mb`	15
`max_megapixels`	12

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

Exploitez le résultat dans les maquettes et les livrables

L’automatisation par API coûte $0.002 par requête ; le navigateur convient aux contrôles ponctuels.

Questions techniques

Combien coûte l’API ?

L’API coûte $0.002 par requête. Vous pouvez aussi effectuer gratuitement un contrôle ponctuel dans le navigateur.

Consulter la documentation complète du KIT →

Lancer gratuitement

Exemple résolu

Mesurez le logo et le repère à la même échelle

Appliquez correctement le multiple de protection

Exploitez le résultat dans les maquettes et les livrables

Cas d’usage

Dimensionner un en-tête de site

Préparer un document imprimé

Contrôler des modèles graphiques

Questions fréquentes

Outils associés

Pour les développeurs — accès API

Endpoint

Appeler depuis votre stack

Exemple de requête

Exemple de réponse

Tarifs

Limites

Erreurs

Notes techniques

Exploitez le résultat dans les maquettes et les livrables

Questions techniques

merci