Skip to content

Rendering in the Hud

We already briefly touched on rendering things to the hud in the Basic Rendering Concepts page and Using The Drawing Context, so on this page we'll stick to the HudRenderCallback event and the deltaTick parameter.


The HudRenderCallback event - provided by Fabric API - is called every frame, and is used to render things to the HUD.

To register to this event, you can simply call HudRenderCallback.EVENT.register and pass in a lambda that takes a DrawContext and a float (deltaTick) as parameters.

The draw context can be used to access the various rendering utilities provided by the game, and access the raw matrix stack.

You should check out the Draw Context page to learn more about the draw context.


The deltaTick parameter is the time since the last frame, in seconds. This can be used to make animations and other time-based effects.

Example: Lerping a Color Over Time

Let's say you want to lerp a color over time. You can use the deltaTick parameter to do this.

HudRenderCallback.EVENT.register((context, tickDelta) -> {
	int color = 0xFFFF0000; // Red
	int targetColor = 0xFF00FF00; // Green

	// Total tick delta is stored in a field, so we can use it later.
	totalTickDelta += tickDelta;

	// "lerp" simply means "linear interpolation", which is a fancy way of saying "blend".
	float lerpedAmount = MathHelper.abs(MathHelper.sin(totalTickDelta / 50F));
	int lerpedColor = ColorHelper.Argb.lerp(lerpedAmount, color, targetColor);

	// Draw a square with the lerped color.
	// x1, x2, y1, y2, z, color
	context.fill(0, 0, 100, 100, 0, lerpedColor);

Lerping a color over time