§ How to · with Picoo

How to make a health bar in Roblox

By Sametcan Tasgiran, Founder & Developer·Published ·Updated

A health bar reads the player's Humanoid, sizes a fill from Health divided by MaxHealth, and has to keep working after the player dies. Ask Picoo for a health bar and it applies its combat_hud recipe: one LocalScript that builds an on-screen HUD panel with the health bar in it.

1 file · 210 lines · one recipe call. Six colour themes. A stamina bar and combo badge share the panel by default, and the recipe can leave either out.

Health bar on the player's screen

A rounded glass panel at the bottom centre of the screen holds the HEALTH bar, captioned with current and max health, such as HEALTH 100/100.

Event-driven updates

The bar listens to Humanoid.HealthChanged and to MaxHealth changes, so it redraws only when a value moves, and each redraw tweens the fill over 0.18 seconds.

MaxHealth-aware fill

The fill is Health divided by MaxHealth, clamped between 0 and 1, so a buff that raises MaxHealth never pushes it past the end of the bar.

Respawn-safe

ResetOnSpawn is off on the ScreenGui, and the script binds to every new character through CharacterAdded, so the bar keeps working after each death.

Stamina and combo, ready for combat

A stamina bar and a combo badge sit on the same panel. They update from ReplicatedStorage.CombatRemotes.CombatState, the RemoteEvent Picoo's combat_system recipe fires; without one they stay idle while the health bar keeps working.

Six colour themes

Crimson by default, or blue, emerald, gold, violet or shadow, or an exact accent colour. At start the script removes any ScreenGui already named CombatHUD, such as the one Picoo's combat_system recipe builds, instead of adding a second.

Files Picoo ships for this prompt

1 file · 210 lines · one recipe call

StarterPlayer/StarterPlayerScripts/CombatHUD

LocalScript that builds the CombatHUD ScreenGui in code when the player joins: the panel, the health bar bound to the Humanoid, and the stamina bar and combo badge bound to CombatState.

210 lines

Sample output: StarterPlayer/StarterPlayerScripts/CombatHUD

--!strict
-- Generated by Picoo recipe: combat_hud (theme: crimson)
-- Built entirely in code: ONE script, zero bridge round-trips, no partial HUD.
local Players = game:GetService("Players")
local ReplicatedStorage = game:GetService("ReplicatedStorage")
local TweenService = game:GetService("TweenService")

local player = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

-- Re-appliable: drop any previous HUD with this name (including the one
-- combat_system builds) so re-theming replaces instead of stacking.
local old = playerGui:FindFirstChild("CombatHUD")
if old then old:Destroy() end

local gui = Instance.new("ScreenGui")
gui.Name = "CombatHUD"
gui.ResetOnSpawn = false
gui.IgnoreGuiInset = true
gui.DisplayOrder = 20
gui.Parent = playerGui

-- (excerpt) after the panel, the STAMINA and HEALTH bars and the combo badge:

-- HEALTH: straight off the Humanoid, so this half works with or without a
-- combat system.
local function bindHumanoid(char: Model)
	local hum = char:WaitForChild("Humanoid", 10) :: Humanoid?
	if not hum then return end
	local function render()
		local f = healthFill
		if not f then return end
		local maxHp = math.max(hum.MaxHealth, 1)
		local pct = math.clamp(hum.Health / maxHp, 0, 1)
		TweenService:Create(f, TweenInfo.new(0.18), { Size = UDim2.new(pct, 0, 1, 0) }):Play()
		if healthText then
			(healthText :: TextLabel).Text = string.format("HEALTH  %d/%d", math.floor(hum.Health + 0.5), math.floor(maxHp + 0.5))
		end
	end
	hum.HealthChanged:Connect(render)
	hum:GetPropertyChangedSignal("MaxHealth"):Connect(render)
	render()
end
if player.Character then task.spawn(bindHumanoid, player.Character) end
player.CharacterAdded:Connect(function(char) task.spawn(bindHumanoid, char) end)

Building a health bar in Roblox

A health bar looks like a combat feature, but it is a GUI problem: where the bar lives, what it reads, and whether it survives the player dying. Ask Picoo for one and it applies its combat_hud recipe, which writes a single LocalScript that builds the whole HUD in code when the player joins.

The HUD is a ScreenGui called CombatHUD with a rounded glass panel at the bottom centre of the screen. The health bar is a dark track with a gradient fill, and its caption shows the numbers, such as HEALTH 100/100. By default the panel also holds a stamina bar above the health bar and a combo badge in its top-right corner, and the recipe can leave either out.

The health bar reads the Humanoid directly. The script connects to HealthChanged and to MaxHealth's change signal, so it redraws only when something moves, and each redraw tweens the fill to Health divided by MaxHealth, clamped between 0 and 1, over 0.18 seconds. Because the fill is a ratio, a buff that raises MaxHealth changes how full the bar is instead of pushing the fill past its frame.

Respawns are covered twice. ResetOnSpawn is off, so the ScreenGui is not destroyed and re-cloned when the player dies, and the script listens to CharacterAdded and binds to each new Humanoid. The stamina bar and combo badge listen to ReplicatedStorage.CombatRemotes.CombatState, the RemoteEvent Picoo's combat_system recipe fires with stamina and combo count. With no combat system in the place, the script waits 15 seconds, prints a warning and leaves those two idle, and the health bar works as before.

Bars over other characters' heads are a different piece: a BillboardGui on each head, with MaxDistance set so distant bars stop rendering. Ask for them in a follow-up prompt, along with hiding Roblox's built-in health display, a low-health colour or a damage flash. Bosses built by Picoo's dramatic_boss recipe already come with their own BillboardGui HP bar.

See more on the Luau generator, the AI Luau script writer, the 3D model generator and the game builder, read how Picoo compares with ChatGPT, or browse the full blog.

Frequently asked

What does Picoo build when I ask for a health bar?+

One LocalScript, StarterPlayer/StarterPlayerScripts/CombatHUD, from the combat_hud recipe. When the player joins it builds a ScreenGui called CombatHUD with a panel at the bottom centre of the screen holding a stamina bar, the health bar and a combo badge. The recipe has switches to leave the stamina bar and combo badge out when you only want health.

Can I put health bars over enemies' heads?+

Yes, in a follow-up prompt; this recipe draws the local player's own bar on the screen. An over-the-head bar is a BillboardGui on each character's head, and setting its MaxDistance stops far-away bars from rendering. Bosses from Picoo's dramatic_boss recipe already carry a BillboardGui HP bar over the head.

What about Roblox's built-in health bar?+

The recipe leaves it enabled. To hide it, ask in a follow-up prompt for StarterGui:SetCoreGuiEnabled(Enum.CoreGuiType.Health, false) in a LocalScript. That call can error if it runs before Roblox's core scripts have loaded, which is common right at join, so wrap it in pcall and retry a few times.

Why doesn't the fill overflow when MaxHealth goes up?+

The fill is a ratio. The script divides Health by MaxHealth, clamps the result between 0 and 1 and sizes the fill from that, and it redraws when MaxHealth changes as well as when Health does. A bar sized from raw health runs off its frame as soon as a buff raises MaxHealth to 200.

Does it keep working after the player dies?+

Yes. The ScreenGui has ResetOnSpawn set to false, so it is not rebuilt on respawn, and the script binds to each new character through CharacterAdded, connecting HealthChanged on the new Humanoid.

What if my game already has its own HUD or scripts?+

The recipe is for a new or nearly empty place. In a place that already has your own systems, Picoo reads the scripts that are there and adds or changes only what the health bar needs, so the result follows your game rather than this page.

Related Picoo prompts