Replace shader with heart SDF and update screenshot

simple_sdf/shaders/SDF.frag

@@ -7,19 +7,36 @@ precision mediump float;
 uniform vec2 resolution;
 out vec4 fragColor;
 
-vec3 flutterBlue = vec3(5, 83, 177) / 255;
-vec3 flutterNavy = vec3(4, 43, 89) / 255;
-vec3 flutterSky = vec3(2, 125, 253) / 255;
+vec3 pink = vec3(255, 105, 180) / 255;
+
+// dot2 and sdHeart from https://iquilezles.org/articles/distfunctions2d/
+float dot2(vec2 v) { return dot(v, v); }
+float sdHeart(in vec2 p) {
+  p.x = abs(p.x);
+
+  if (p.y + p.x > 1.0)
+    return sqrt(dot2(p - vec2(0.25, 0.75))) - sqrt(2.0) / 4.0;
+  return sqrt(min(dot2(p - vec2(0.00, 1.00)),
+                  dot2(p - 0.5 * max(p.x + p.y, 0.0)))) *
+         sign(p.x - p.y);
+}
 
 void main() {
   vec2 st = FlutterFragCoord().xy / resolution.xy;
-
+  // Remap coordinates.
+  // Flutter normalized coordinates have range [0,1] but sdHeart expects [-1,1].
+  st = (st - vec2(0.5)) * vec2(2.0);
+  // Center the heart.
+  // sdHeart is written such that the bottom point is at (0,0) and it's about 1
+  // unit tall.
+  st.y -= 0.5;
+  // Invert Y coordinate.
+  st.y *= -1;
+
+  // Calculate the color of this pixel according to the heart SDF, using
+  // smoothstep to anti-alias the edges.
   vec3 color = vec3(0.0);
-  vec3 percent = vec3((st.x + st.y) / 2);
-
-  color =
-      mix(mix(flutterSky, flutterBlue, percent * 2),
-          mix(flutterBlue, flutterNavy, percent * 2 - 1), step(0.5, percent));
+  color = mix(pink, color, smoothstep(0.01, 0.02, sdHeart(st)));
 
   fragColor = vec4(color, 1);
 }