Compiler LESS en CSS en ligne — Compilateur less.js navigateur

Compilez un extrait LESS ou regroupez un dossier de projet local avec résolution native de @import. Compression et source maps monofichier — tout s'exécute dans votre navigateur.

Chargement…
Compilateur LESS — guide navigateur
Compilez des extraits LESS en CSS standard avant minification ou partage. Exécute less.js à la demande dans votre navigateur.

Notes développeur

• Déposez un dossier pour résoudre les @import locaux. node_modules, les paquets et les URL distantes ne sont pas résolus. • Le JavaScript inline dans LESS est désactivé par défaut ; activez-le seulement si vous faites confiance à la source. • Strict math exige des parenthèses autour des calculs quand activé. • Auto-compilation au collage/exemple ; la saisie nécessite Compiler (⌘↵). • Les source maps sont disponibles en monofichier et indisponibles en mode projet v1.

Regrouper des partials locaux

Choisissez Regrouper un projet, déposez un dossier puis sélectionnez un fichier d’entrée. FastMinify conserve les chemins relatifs et Less découvre les fichiers .less accessibles via @import. La limite locale est de 32 Mio par fichier et 32 Mio au total. La v1 accepte une seule entrée, sans source map ni résolution de paquets node_modules.

Options

Compresser
Supprime les espaces superflus de la sortie CSS compilée.
Source map
Intègre une source map inline dans la sortie CSS pour le débogage.
JavaScript inline
Autorise les fonctionnalités LESS qui évaluent des expressions JavaScript — désactivé par défaut par sécurité.
Strict math
Exige des parenthèses autour des opérations mathématiques dans les expressions LESS.

Quand les équipes choisissent cette voie

• Convertir des composants LESS legacy en CSS pour migration. • Prévisualiser des mixins paramétriques avant intégration dans un build. • Partager du CSS compilé avec des collègues qui n'utilisent pas LESS. • Vérifier rapidement expressions de guards et opérations.

Exemples commentés

Variables et opérations

Entrée LESS

@base: #336699; @gap: 8px + 4px; .panel { color: @base; margin: @gap; }

CSS compilé

.panel { color: #336699; margin: 12px; }

Mixin paramétrique

Entrée LESS

.rounded(@r: 4px) { border-radius: @r; } .btn { .rounded(6px); padding: 8px; }

CSS compilé

.btn { border-radius: 6px; padding: 8px; }

Outils associés

Beautifiez LESS avec beautifier LESS, décompressez avec déminifier LESS, ou parcourez le hub préprocesseurs CSS.

FAQ compilateur LESS

Compilation navigateur uniquement

Pourquoi ne puis-je pas utiliser @import pour Bootstrap ou d'autres bibliothèques ?

Les projets regroupés résolvent les fichiers .less locaux déposés dans le navigateur. Les chemins vers node_modules, des paquets, des CDN ou hors du dossier déposé ne sont pas disponibles.

Que fait Strict math ?

Quand activé, des calculs comme 8px + 4px exigent des parenthèses. Cela correspond aux modes compilateur LESS plus stricts utilisés dans certains pipelines de build.

Quand la compilation s'exécute-t-elle automatiquement ?

Au collage et au chargement d'exemple. La saisie seule ne déclenche pas la compilation — utilisez Compiler ou ⌘↵.

Un projet regroupé est-il une simple concaténation ?

Non. Less part d’un fichier d’entrée et résout uniquement les dépendances @import atteignables. Aucun ordre manuel n’est concaténé. La v1 est limitée à une entrée, 32 Mio au total, sans source map ni imports npm.

Préprocesseurs CSS

Compilez SCSS ou LESS en CSS standard dans le navigateur — complétez avec beautify ou minify pour un workflow feuille de style complet.

Découvrez les autres catégories d'outils

Minifier

Réduisez code et assets pour la production — minifiez JS, CSS, HTML, JSON, XML et SVG avant gzip ou déploiement CDN.

Déminifier

Développez du code minifié ou compressé — déminifiez JavaScript, CSS, TypeScript, SCSS, LESS, SQL, YAML et d'autres formats pour déboguer ou relire.

Conversion

Transformez des données entre JSON, YAML, XML et CSV localement — sans envoi serveur.

Encodage

Encodez ou décodez Base64, composants URL et entités HTML — uniquement côté client.

Sérialisation

Sérialisez et désérialisez des structures PHP à côté de vos flux JSON.

Outils JSON

Validez, formatez, comparez et explorez des payloads JSON — complémentaires aux minificateurs et convertisseurs.

Outils SVG

Prévisualisez, optimisez avec SVGO, exportez en Data URI, redimensionnez, formatez, convertissez en JSX et validez vos SVG — tout dans le navigateur.

Beautifier

Rendez le code lisible avec une indentation cohérente — beautifiez JavaScript, CSS, TypeScript, SCSS, LESS, Markdown, GraphQL, SQL, YAML et plus encore dans votre navigateur.

Outils couleur & CSS

Vérification de contraste WCAG en collage local avec syntaxe couleur CSS moderne — vues paire et matrice, jamais envoyé.

DevOps & Infra

Format/validate/minify HCL, format & lint Dockerfile, validation Compose et .env.

CI/CD

GitHub Actions et GitLab CI — formater le YAML et vérifier la structure des workflows/jobs dans le navigateur.

Logs & observabilité

JSON/NDJSON ligne à ligne et access logs Nginx/Apache — format, filtre, validation et CSV/TSV.

Kubernetes

Manifestes multi-docs, validation structurelle, starters Ingress/Deployment et formatage values Helm.

Réseau / IP

CIDR, sous-réseaux et helpers IPv4/IPv6 — dans le navigateur.

Sécurité & tokens

JWKS, certificats X.509 et scan de secrets — locaux navigateur.

API & schémas

Outils OpenAPI pour formater, valider et analyser vos specs.

Outils HTTP

cURL, messages HTTP, URLs, HAR et Cookie / Set-Cookie collés dans le navigateur — formater et inspecter, jamais envoyé.

Utilitaires développeur

Timestamps, UUID, ULID, Nanoid, cron, mots de passe, regex, slugify, bases, casse, diff texte et chmod — tout côté client.

Texte & Markdown

Comptez, générez un sommaire Markdown et nettoyez des listes de lignes — dans le navigateur.

IA & LLM

Comptage de tokens, estimation des coûts et fenêtre de contexte — 100 % local.

Données de test

Valeurs de champs synthétiques pour fixtures et seed DB — d'abord des numéros de téléphone en plages réservées.