Issue with health bar updating properly

I created a health bar image and I’m using the UI gradients offset to cause the effect but I don’t see a visual change until I drop to 80 health and the bar appears empty at 20 health.

-- Variables
local Players = game:GetService("Players")
local Tweens = game:GetService("TweenService")
local Player = game.Players.LocalPlayer
local Character = Player.Character or Player.CharacterAdded:Wait()
local HealthFill = script.Parent.Healthbar.Background.Fill
local FillTweenInfo = TweenInfo.new(0.25)

-- Functions
local function UpdateHealthBar(humanoid: Humanoid)
	local Tween = Tweens:Create(HealthFill.UIGradient, FillTweenInfo, {Offset = Vector2.new(humanoid.Health / humanoid.MaxHealth)})
	Tween:Play()
end

local function LoadCharacter(newCharacter: Model)
	if not newCharacter then
		return
	end
	
	-- Replace old char with new
	Character = newCharacter
	local humanoid = newCharacter:WaitForChild("Humanoid")
	
	-- Listen for health changes
	humanoid:GetPropertyChangedSignal("Health"):Connect(function()
		UpdateHealthBar(humanoid)
	end)
	
	humanoid:GetPropertyChangedSignal("MaxHealth"):Connect(function()
		UpdateHealthBar(humanoid)
	end)
	
	-- Init the health bar
	UpdateHealthBar(humanoid)
end

LoadCharacter(Character)

Instead of using offset, try using scale instead
(Goal part of your tween)

{Size = UDim2.fromScale(humanoid.Health / humanoid.MaxHealth,1)}

I use Offset because I’m positioning a UI Gradient in the fill bar to make it smoother since it’s not a perfect rectangle bar, switching to the Fill bar itself and Size causes its own issues.