Pixel Circle & Ellipse

A pixelated circle, pure and simple. Great for pixel art. You can modify and use this for:

  1. Fake Shadows
  2. Base for other more complex shaders
  3. Bullets
  4. … and much more!

How to use:

  1. Drag and Drop Godot Icon into the 2D viewport (add it to the game).
  2. Apply this shader to the godot icon.
  3. Change its parameter shaders
    1. Color and alpha
    2. Elipse Factor (45 for a circle)
    3. Radius

It’s a circle, go nuts.

Inspired by https://godotshaders.com/shader/circular-life-bar/

Shader code
// Released under MIT License, Tengku Izdihar, 2025
shader_type canvas_item;

uniform float radius :hint_range(0, 1) = 0.05;
uniform vec4 circle_color : source_color = vec4(1);
uniform float elipse_factor :hint_range(0, 90) = 60;

void fragment(){
	vec2 pixelNumber = vec2(textureSize(TEXTURE, 0));
	vec2 pixelated_UV = round(UV * pixelNumber) / pixelNumber;
	vec2 uv = (pixelated_UV * 2.0 - 1.0);

	float ef = radians(elipse_factor);
	uv.x *= cos(ef);
	uv.y *= sin(ef);

	float circle = ceil(length(uv) - radius);
	circle = 1. - circle;
	circle = clamp(circle, 0, circle_color.a);

	COLOR = circle_color;
	COLOR.a = circle;
}
Tags
circle, Ellipse, pixel-art, simple
The shader code and all code snippets in this post are under MIT license and can be used freely. Images and videos, and assets depicted in those, do not fall under this license. For more info, see our License terms.

Related shaders

Simple Ellipse Shader

Circle Mask (with Feathering & Position)

Circle Pixel

Subscribe
Notify of
guest

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments