# Calculatrice CSS clamp

> Génère une typographie ou des espacements fluides entre des limites de fenêtre d'affichage.

[Open tool](https://www.toolcabana.com/fr/css-clamp-calculator) · [Design et CSS](https://www.toolcabana.com/fr/category/design-and-css)

Tool ID: css-clamp-calculator. Requested language: fr. Description language: fr. Complete guide translation: yes.

## Overview (en)

CSS clamp calculator creates a clamp() value that scales a font size or spacing linearly between a minimum and maximum pixel size across a viewport range. Enter both sizes and both viewport widths, which default to 16 to 32 px between 320 and 1280 px viewports, and get a calc() expression combining px and vw plus a live text preview.

## Supported tasks (fr)

Génère une typographie ou des espacements fluides entre des limites de fenêtre d'affichage.

## Steps (fr)

1. Saisissez les valeurs demandées dans le panneau des paramètres.
2. Ajustez les paramètres de base, puis ouvrez le mode avancé pour les options d'export et de réglage fin. Vos paramètres personnalisés restent actifs une fois le panneau fermé.
3. Lancez la calculatrice CSS clamp, vérifiez le résultat, puis utilisez les commandes de copie ou de téléchargement disponibles.

## Settings

- Taille minimale de police / espacement (px) (fr; key: minSize; type: number); minimum: 0; maximum: 1000
- Taille maximale de police / espacement (px) (fr; key: maxSize; type: number); minimum: 0; maximum: 1000
- Fenêtre d'affichage minimale (px) (fr; key: minViewport; type: number); minimum: 1; maximum: 10000
- Fenêtre d'affichage maximale (px) (fr; key: maxViewport; type: number); minimum: 1; maximum: 10000

## Limitations (fr)

Les images respectent la limite existante de 32 mégapixels du canevas. Jusqu'à 100 images sources sont autorisées lorsque c'est pris en charge. Le HTML collé est limité à 200 000 caractères ; les diagrammes Mermaid à 20 000 caractères et 300 lignes. La génération SVG et PNG nécessite un navigateur.

## Privacy and connections (fr)

Cette opération traite sa source dans votre navigateur. La copie et le téléchargement sont des actions explicites ; la saisie source n'est enregistrée ni dans un compte ni dans l'historique.

## Questions (fr)

### How do I calculate a fluid font size with CSS clamp?

The slope is the size difference divided by the viewport difference. The middle value becomes an intercept in px plus the slope times 100 in vw, so the size reaches the minimum at the small viewport and the maximum at the large one. The calculator does this for you.

### Why does the clamp calculator output px instead of rem?

All inputs and outputs are in pixels, and the middle term combines px with vw rounded to six decimals. If your design system uses rem, divide the pixel values by your root font size after copying the result.

### What causes the error that maximum viewport must exceed minimum?

The maximum viewport must be larger than the minimum viewport, and the maximum size cannot be smaller than the minimum size. Equal sizes are allowed and produce a fixed value. Swap the fields if you entered them in the wrong order.

### Où ma saisie est-elle traitée ?

Cette opération traite sa source dans votre navigateur. La copie et le téléchargement sont des actions explicites ; la saisie source n'est enregistrée ni dans un compte ni dans l'historique.

### Quelles sont les limites de saisie ?

Les images respectent la limite existante de 32 mégapixels du canevas. Jusqu'à 100 images sources sont autorisées lorsque c'est pris en charge. Le HTML collé est limité à 200 000 caractères ; les diagrammes Mermaid à 20 000 caractères et 300 lignes. La génération SVG et PNG nécessite un navigateur.

## Related tools

- [CSS grid layout generator](https://www.toolcabana.com/fr/css-grid-layout-generator)
- [CSS flexbox playground](https://www.toolcabana.com/fr/css-flexbox-playground)
- [CSS cubic Bezier editor](https://www.toolcabana.com/fr/css-cubic-bezier-editor)
- [CSS clip-path maker](https://www.toolcabana.com/fr/css-clip-path-maker)