Packs d'interface
Carbon Kit de panneaux — panneaux à équerres et boutons
Panneaux de fenêtre nine-slice à équerres en fibre de carbone, cadres de liste en creux et quatre états de bouton chanfreiné, en SVG et PNG en 1x/2x/4x.

À propos de ce pack
Le même dégradé spéculaire à cinq paliers et le même motif de lignes brossées que la famille acier neutre, sur une palette bien plus sombre et avec le corps ouvert en équerres de coin. Ce dernier changement est ce qui transforme un panneau en encadrement d'instrument : une bordure fermée se lit comme une fenêtre, quatre équerres se lisent comme quelque chose de boulonné à un tableau de bord. Les rivets restent, parce qu'un panneau de cockpit qui n'est fixé à rien est un rendu.
Deux panneaux nine-slice — un cadre de fenêtre à équerres de coin avec des coins de 10 px et un cadre intérieur en creux avec des coins de 8 px — couvrent presque toutes les boîtes dont un menu a besoin : dialogues, grilles d'inventaire, fonds de liste, infobulles et panneaux de statistiques. Il n'y a aucune bordure continue — quatre équerres de coin marquent les limites et le reste est ouvert, si bien que le panneau encadre le contenu sans l'enfermer. Les deux s'étirent proprement à n'importe quelle taille parce que les coins ne changent jamais d'échelle et que le centre est un remplissage plat.
Sur les panneaux se posent quatre états de bouton chanfreiné : normal, survol, enfoncé et désactivé. Ils sont dessinés sur la même base de 152×44 avec des coins de 4 px : vous échangez la texture sur un seul widget de bouton et vous obtenez toute la boucle d'interaction sans déplacer un rectangle. L'état enfoncé descend sa face de deux pixels et retire le reflet du haut au lieu de simplement s'assombrir, et c'est ce qui donne à un bouton la sensation d'être cliqué plutôt que simplement recoloré.
Tout est livré deux fois. Les sources SVG sont les fichiers dans lesquels le kit a été dessiné — ouvrez-les, changez les six tons presque noir ou l'unique accent ambre d'avertissement, et réexportez. Les exports PNG sont plats, transparents et pré-mis à l'échelle en 1x, 2x et 4x pour les moteurs qui veulent des bitmaps, sans alpha prémultiplié et sans ombre cuite hors des limites du sprite.
Téléchargement
Lien direct · sans inscription · sans page d'attenteKit complet — sources SVG, exports PNG en 1x/2x/4x, licence et readme
Comment l'utiliser
- Dans Unity, importez les PNG, réglez Texture Type sur Sprite (2D and UI) et la bordure sur 10, 10, 10, 10 pour le panneau de fenêtre et 4, 4, 4, 4 pour les boutons ; puis réglez Image Type sur Sliced sur le composant d'interface.
- Dans Godot 4, utilisez un NinePatchRect et réglez les marges du patch sur les mêmes valeurs, ou déposez directement le SVG et laissez Godot le rastériser à l'échelle définie dans les options d'import.
- Dans Unreal, importez en Texture2D, créez un Slate Brush avec Draw As réglé sur Box et saisissez la marge en fraction de la taille de texture — 0.07813 pour le panneau de 128 px et 0.02632 pour le bouton de 152 px.
- Pour un rendu net aux échelles d'interface non entières, utilisez le PNG 2x ou 4x plutôt que d'agrandir celui en 1x, ou pointez votre moteur sur la source SVG et laissez-le rastériser à la taille finale.
Licence
Creative Commons Attribution 4.0 — Gratuit pour un usage commercial. Attribution obligatoire. Conditions complètes · Ce que cela veut dire en pratique
"Carbon Kit de panneaux — panneaux à équerres et boutons" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/2d/ui/carbon-panel-ui-kit


