Differences

This shows you the differences between two versions of the page.

--- shader:start [2025/05/28 09:52] – [Circle] mh
+++ shader:start [2025/06/02 21:23] (current) – external edit 127.0.0.1
@@ Line 94: / Line 94: @@
 This behavior can lead to unexpected behaviors and colors in certain regions where multiple subtractions/additions have been applied.</WRAP>
+==== Rectangle ====
+To draw a rectangle we can use a function that draws bands using **''smoothstep''** and then multiply it twice to draw a band horizontally and another band vertically.
+The band function would look like this
+<code glsl>
+float drawBand(float t, float start, float end, float blur){
+    float step1 = smoothstep(start-blur, start+blur, t);
+    float step2 = smoothstep(end+blur, end-blur, t); //This one is inverted because it's on the other side, going from 1 to 0.
+    return step1*step2;
+}
+</code>
+Then get a rectangle by calling this function twice on the x and y :
+<code glsl>
+    float mask = 0.;
+    float b = .01;
+    mask = drawBand(uv.x, -.2, .2, b);
+    mask *= drawBand(uv.y, -.2, .2, b);
+</code>
 ==== Adding Color ====