Créer un thème personnalisé
Suivez ces étapes pour créer et personnaliser votre propre thème :- Ouvrez Paramètres et accédez à Utilisateur → Personnalisation (ou la section Thèmes)
- Sélectionnez Créer un nouveau thème
- Saisissez un titre, sélectionnez une palette de couleurs (clair ou sombre) et ajoutez une description facultative
- Sélectionnez Créer le thème pour ouvrir l’éditeur de thèmes
- Arrière-plan : Définit la couleur de base pour la plupart des surfaces de l’interface
- Contour : Contrôle la couleur des bordures et des séparateurs
- Premier plan : Détermine les couleurs du texte et des icônes
- Principal : Définit la couleur des boutons et des éléments interactifs
- Positif : S’applique aux indicateurs de succès comme le bouton Exécuter
- Négatif : S’affiche pour les erreurs et les avertissements d’actions destructives
Coloration syntaxique
Personnalisez l’apparence des différents éléments de code pour améliorer la lisibilité et la compréhension.Éléments de la coloration syntaxique
Éléments de la coloration syntaxique
| Élément | Description |
|---|---|
| Noms de variables | S’applique aux variables sans mot-clé de déclaration |
| Définitions de variables | Colore les noms de variables définis avec des mots-clés comme const ou var |
| Références de fonctions | S’applique lors de l’appel de fonctions |
| Définitions de fonctions | Colore les noms de fonctions lors de leur déclaration |
| Mots-clés | Met en évidence les mots-clés du langage comme import, function et return |
| Noms de propriétés | Colore l’accès aux propriétés depuis les variables |
| Définitions de propriétés | Utilisé lors de la définition des propriétés d’objets |
| Propriétés de fonctions | S’applique lors de l’appel de méthodes sur des objets |
| Noms de balises | Utilisé pour les balises HTML et JSX |
| Noms de types | Colore les annotations de type dans les langages typés |
| Noms de classes | S’applique aux déclarations et références de classes |
| Noms d’attributs | Met en évidence les attributs HTML et JSX |
| Commentaires | S’applique à tous les commentaires de code |
| Chaînes | Colore les littéraux de chaîne |
| Nombres | Met en évidence les valeurs numériques |
| Booléens | Formate les valeurs booléennes (true/false) |
| Expressions régulières | Colore les motifs regex |
| Opérateurs | Met en évidence les opérateurs comme +, -, * et / |
| Accolades | Colore les crochets et chevrons lorsque approprié |
Bonnes pratiques de conception de thèmes
Créez des thèmes visuellement attrayants et fonctionnels en suivant ces directives :Couleur et contraste
- Équilibrer le contraste : Assurer une différence suffisante entre les éléments d’arrière-plan et de premier plan
- Créer des palettes cohérentes : Choisir des couleurs qui se complètent plutôt que se heurtent
- Maintenir une luminosité constante : Conserver un niveau de luminosité similaire entre les éléments syntaxiques
- Concevoir pour l’accessibilité : Tenir compte des utilisateurs ayant des déficiences visuelles en évitant les combinaisons à faible contraste
Gérer vos thèmes
Accédez à et gérez tous vos thèmes installés dans Paramètres sous Utilisateur → Personnalisation (ou la section Thèmes).Changer de thème
Sélectionnez le bouton à côté du titre d’un thème pour l’activer comme thème actuel.Modifier les thèmes
Modifiez vos thèmes personnalisés en sélectionnant le menu à trois points et en cliquant sur Modifier.Seuls les thèmes personnalisés que vous avez créés peuvent être modifiés ou supprimés. Les thèmes par défaut et les thèmes créés par d’autres ne peuvent pas être modifiés.
Supprimer des thèmes
Supprimez des thèmes personnalisés en utilisant le menu à trois points et en sélectionnant Supprimer.Explorer les thèmes communautaires
Découvrez les thèmes créés par la communauté Replit sur la Page d’exploration des thèmes.Trouver des thèmes
- Recherchez par nom pour trouver des thèmes spécifiques comme « Atom One Dark »
- Filtrez par auteur pour explorer les thèmes de créateurs spécifiques
- Parcourez par palette de couleurs pour trouver des thèmes clairs ou sombres
- Recherchez par couleurs spécifiques selon vos préférences
Portage depuis VS Code
Importez vos thèmes VS Code favoris dans Replit en associant les couleurs équivalentes lors du processus de création de thème.Publier votre thème
Partagez vos thèmes personnalisés avec la communauté Replit en suivant ces étapes :- Ouvrez l’éditeur de thèmes pour votre thème personnalisé
- Sélectionnez le bouton Publier
- Remplissez les champs titre et description
- Soumettez votre thème
Ressources associées
- Fonctionnalités du workspace - Explorez d’autres fonctionnalités du workspace comme Console, Shell et Multiplayer
- Paramètres utilisateur - Configurez vos préférences de workspace
- Raccourcis clavier - Accélérez votre workflow avec des raccourcis clavier
- Collaboration Multiplayer - Collaborez en temps réel avec les membres de l’équipe