UI-Packs
Inkwell HUD-Balken — Treffer, Ladung und Combo
16 getuschter Comic HUD-Balken-Sprites: normale, schmale und vertikale Rahmen, je drei gebänderten Füllungen, dazu geteilte, Geister- und Schildvarianten.

Über dieses Pack
Statusbalken mit derselben vier Pixel starken Kontur wie die Panels. Die Füllungen sind reine flache Farbe, denn ein Verlauf in einer getuschten Form liest sich als Fehler statt als Material.
Der Rahmen ist ein Nine-Slice mit 12 px Endkappen, er dehnt sich also auf jede Breite, ohne dass die Enden verformen — ein bildschirmbreiter Boss-Balken und ein 40 px Gegner-Namensbalken nutzen dieselbe Datei.
Die Füllungen sind eigene Sprites statt in den Rahmen eingebrannt, und das ist der Teil, der in der Praxis zählt: Du skalierst die Breite der Füllung von null auf voll und der Rahmen bewegt sich nie. Jede Füllung ist in drei waagerechten Bändern gezeichnet — ein helles oberes Band, ein Mittelton und eine dunkle Unterkante — sie liest sich deshalb auch in kleinen Größen noch als Balken, wo ein flaches Rechteck zum Schmier wird.
Es gibt drei Farben, eine pro Ressource: Treffer, Ladung und Combo. Sie liegen in der Helligkeit ebenso weit auseinander wie im Farbton — das ist der Teil, der einen Graustufen-Screenshot und die häufigsten Formen der Farbenblindheit übersteht. Ein auf gleiche Helligkeit abgestimmtes Set wirkt in einer Farbreihe ausgewogen und fällt auf dem Bildschirm zu einem grauen Block zusammen.
Die geteilte Variante legt 4 Kerblinien über denselben Rahmen, für Spiele, die diskrete Einheiten zählen — Herzen, Ladungen, Munition — statt einen fortlaufenden Prozentsatz. Sie ist eine eigene Datei und kein Overlay, du kannst sie also einsetzen, ohne dein Balken-Widget zu ändern.
Drei Rahmenvarianten decken ab, wo Balken tatsächlich sitzen: der normale Balken, ein schmaler für gegnerische Namensschilder und ein vertikaler, denn eine Manasäule ist kein gedrehter Lebensbalken — ein gedrehtes Nine-Slice dehnt seine Endkappen entlang der falschen Achse. Jede Variante hat ihren eigenen Satz von drei Füllungen.
Zwei Overlay-Füllungen decken die Zustände ab, die ein einzelner Balken nicht allein zeigen kann. Die Geisterfüllung ist hohl und gestrichelt: sie markiert den gerade verlorenen Abschnitt, sodass ein Treffer als Veränderung statt als neue Zahl gelesen wird. Die Schildfüllung ist schraffiert statt eingefärbt, denn eine Absorptionsschicht liegt über dem Ressourcenbalken und eine zweite Farbe dort kollidiert mit der Farbe darunter. Alles ist als bearbeitbares SVG und als flaches transparentes PNG in 1x, 2x und 4x enthalten.
Download
Direkter Link · keine Anmeldung · keine WarteseiteKomplettes Kit — SVG-Quellen, PNG-Exporte in 1x/2x/4x, Lizenz und Readme
So wird es benutzt
- Zeichne zuerst den Rahmen, dann die Füllung darüber, deren linke Kante um die 12 px Kappenbreite eingerückt ist; nur die Breite der Füllung zu animieren hält die Enden des Rahmens vollkommen ruhig.
- In Unity setze das Füllbild auf Image Type Filled mit Fill Method Horizontal, oder nimm ein Sliced Image und animiere die RectTransform-Breite — beides geht, weil die Füllung selbst keine runden Ecken hat.
- In Godot 4 bildet eine TextureProgressBar mit dem Rahmen als Under Texture und der Füllung als Progress Texture das Ganze ohne Code nach, und Stretch Mode auf Tile hält die Kappen intakt.
- Für Pip-Ressourcen nimm den segmentierten Rahmen und raste die Füllbreite auf Vielfache eines Fünftels der Innenbreite, damit die Füllkante immer auf einer Kerbe landet.
Lizenz
Creative Commons Namensnennung 4.0 — Kostenlos für kommerzielle Nutzung. Namensnennung erforderlich. Vollständige Bedingungen · Was das in der Praxis heißt
"Inkwell HUD-Balken — Treffer, Ladung und Combo" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/2d/ui/inkwell-hud-bars


