Add drop shadows (CSS drop-shadows) #135

ErikReider · 2025-07-24T09:57:36Z

Allows for a dynamic shadow that isn't a fixed shape, like our shadow_node. This allows for shadows that "exclude" transparent regions like weirdly shaped surfaces and text buffers.

So according to the Mozilla docs, the drop-shadow works by applying a blur to the base textures alpha mask. So this should mimic the implementation that's used by web browsers. So a 10px radii in the browser should result in the same looking blur here.

Swaync with the smart shadows enabled:

TODO:

render/fx_renderer/fx_pass.c

types/scene/wlr_scene.c

WillPower3309 · 2025-08-10T01:23:29Z

Still need to look at wlr_scene.c

ErikReider · 2025-08-15T21:41:38Z

Converting to draft as there still are a few damage issues :/

ErikReider · 2025-09-27T16:50:42Z

I've been using this for a few months now on multiple machines with the SwayFX PR, and no crashes. Marking as ready :)

Don't render the artifact region of the shadow, only the buffer size + blur radius

Allows for multiple blur sizes to be compensated for unlike the previous one which broke when there were different blur sizes. Would allow for per-node blur_data

…rpart

https://github.com/servo/webrender/blob/c4bd5b47d8f5cd684334b445e67a1f945d106848/webrender/res/cs_blur.glsl#L84

…ckwards compat

Helps when the shadow is far from the reference buffer where the original buffer damage wouldn't reach the shadow node

WillPower3309 · 2025-10-14T04:54:58Z

include/scenefx/types/fx/blur_data.h

 #include <stdbool.h>
 #include <wlr/util/addon.h>

+#define drop_shadow_calc_size(blur_sigma) (ceil(1.5f * blur_sigma) * 2)


Q: does an equal blur radius value result in an equal spread in drop shadow and box shadow?

Yes, but the overall color alpha will vary depending on the textures opacity (should we fix this?)

Hmm, ideally they'd look the same but I haven't dived deep enough to know if this is a trivial problem to solve or not haha

Unfortunately the single pixel transparent area between the shadow and texture would need texture shader side changes (so we can keep that out of scope)

Hmm, ideally they'd look the same

Yeah, I noticed that the drop shadow spread is a bit further than the box one, so I'll be working on fixing that after the university finals season has passed

WillPower3309 · 2025-10-14T05:08:53Z

include/scenefx/types/wlr_scene.h

+enum wlr_scene_shadow_type {
+	WLR_SCENE_SHADOW_TYPE_DROP,
+	WLR_SCENE_SHADOW_TYPE_BOX,
+};


do we need these? We should be able to tell if buffer_link is NULL or not

WillPower3309 · 2025-10-14T05:09:24Z

include/scenefx/types/wlr_scene.h

+ * shadow-type. A drop-shadow returns a larger integer compared to the
+ * box-shadow, so this can be used to dynamically adjust the size and position


why would this be?

WillPower3309 · 2025-10-14T05:11:10Z

include/scenefx/types/wlr_scene.h

+ * NOTE: Please use the `wlr_scene_shadow_get_offset` function to get a dynamic
+ * offset depending on the type.
+ */
+void wlr_scene_shadow_set_type(struct wlr_scene_shadow *shadow, enum wlr_scene_shadow_type type);


I think we can remove this call for now, if we're aligned on my earlier comment

WillPower3309 · 2025-10-14T05:11:41Z

include/types/linked_nodes.h

@@ -0,0 +1,27 @@
+#ifndef TYPES_LINKED_NODES_H


nit: this file should be linked_node.h

WillPower3309 · 2025-10-14T05:44:59Z

render/fx_renderer/gles2/shaders/drop_shadow_final.frag

+uniform float blur_sigma;
+uniform vec4 color;
+uniform bool is_horizontal;


size, blur_sigma and is_horizontal are unused

WillPower3309 · 2025-10-14T05:45:47Z

render/fx_renderer/gles3/shaders/drop_shadow_final.frag

+uniform vec2 size;
+uniform float blur_sigma;
+uniform vec4 color;
+uniform bool is_horizontal;


size, blur_sigma, is_horizontal unused

WillPower3309 · 2025-10-14T05:50:03Z

types/scene/wlr_scene.c

+int wlr_scene_shadow_get_offset(struct wlr_scene_shadow *shadow) {
+	switch (shadow->type) {
+	case WLR_SCENE_SHADOW_TYPE_DROP:
+		return drop_shadow_calc_size(shadow->blur_sigma);
+	default:
+		return shadow->blur_sigma;
+	}
+}


have you tested that the shadows are functionally identical between box and drop? We'd want the same appearance minus the transparent areas between types. Also, why do you refer to the sigma as offset for the drop shadow?

Realize I already left this comment earlier in blur_data.h

WillPower3309 · 2025-10-14T05:51:36Z

types/scene/wlr_scene.c

+		struct linked_node *shadow_link = linked_nodes_get_sibling(&scene_buffer->drop_shadow_link);
+		if (shadow_link != NULL) {
+			struct wlr_scene_shadow *scene_shadow = wl_container_of(shadow_link, scene_shadow, buffer_link);
+			if (scene_shadow && SCENE_SHADOW_IS_DROP(scene_shadow)) {


do we need this check? We already have an assertion on the link. Maybe we should add another assertion here instead

WillPower3309 · 2025-10-14T05:52:28Z

types/scene/wlr_scene.c

+
+			const int shadow_size = drop_shadow_calc_size(scene_shadow->blur_sigma) * data->scale;
+
+			// Optimization: Fallback to a regular box-shadow if the texture is fully opaque


WillPower3309 · 2025-11-05T17:27:22Z

Late here, but do you think it's worth splitting the shadow node into separate box shadow and drop shadow nodes? Just thinking that there's not really any use case where a comp would want to swap between them on the same node, and it could help split up the impl. Open to your thoughts as well!

ErikReider self-assigned this Jul 24, 2025

ErikReider added the enhancement New feature or request label Jul 24, 2025

ErikReider force-pushed the smart-shadows branch 2 times, most recently from 4e6325e to 3bf8724 Compare July 29, 2025 10:46

ErikReider changed the title ~~Add smart shadows (CSS drop-shadows)~~ Add drop shadows (CSS drop-shadows) Jul 30, 2025

ErikReider marked this pull request as ready for review July 30, 2025 17:56

ErikReider requested a review from WillPower3309 July 30, 2025 17:56

ErikReider mentioned this pull request Jul 30, 2025

Add support for layer-shell drop-shadows WillPower3309/swayfx#452

Open

WillPower3309 requested changes Aug 10, 2025

View reviewed changes

ErikReider marked this pull request as draft August 15, 2025 21:41

ErikReider marked this pull request as ready for review September 27, 2025 16:49

ErikReider added 16 commits October 11, 2025 13:23

Initial implementation of "smart shadows" (CSS drop-shadow)

f77fae6

Made blur direction parsing branch-less

6dc0eb5

Fixed the gaussian function being incorrect

5acbd93

Fixed compilation issues

e392edf

Fixed rendering too much of the shadow onto the main FBO

c5f7c72

Don't render the artifact region of the shadow, only the buffer size + blur radius

Added dynamic blur artifact compensation

4c7c7c1

Allows for multiple blur sizes to be compensated for unlike the previous one which broke when there were different blur sizes. Would allow for per-node blur_data

Render smart shadow behind blur

b22569f

Added preliminary x and y offset support

2e9ac50

Fixed shadow colors being weak compared to the Servo Webrender counte…

1d33051

…rpart

Drastically shrank the blur kernel size to match what Servo uses

466a116

https://github.com/servo/webrender/blob/c4bd5b47d8f5cd684334b445e67a1f945d106848/webrender/res/cs_blur.glsl#L84

Use separate smaller struct for the final shader

7b7f1c7

Downsample the blurring to drastically increase performance

722287e

Renamed to drop-shadow

8d04768

Moved drop-shadow logic into the shadow_node

e053254

Added GLES2 support

be38f46

Fixed remaining TODOs

7575d46

ErikReider added 11 commits October 11, 2025 13:23

Fixed scaling and transforms

e980092

Removed unneeded changes from the diff

bf12bc1

Use wlr_scene_shadow_get_offset when setting the size in the examples

a6c70ba

Removed fx_render_drop_shadow_options

829b41c

Removed the type parameter in the shadow creation function to keep ba…

c12fcbb

…ckwards compat

Fixed accidental indentation changes

dce442d

Make assertions for shadow blur_sigma and color correctness

8b4dd39

Fallback to box-shadow impl if the reference scene_buffer is disabled

78759d1

Fixed shadow using the blur sample size as its blur radius

f37930b

Fixed drop-shadow not being damaged when the reference buffer is damaged

fdc0941

Helps when the shadow is far from the reference buffer where the original buffer damage wouldn't reach the shadow node

Simplified the linking of the scene shadow and buffer nodes

3ee8b33

ErikReider force-pushed the smart-shadows branch from f83d744 to 3ee8b33 Compare October 11, 2025 11:23

WillPower3309 reviewed Oct 14, 2025

View reviewed changes

Fixed compilation error after rebase

8bd82c7

the-eater mentioned this pull request Oct 20, 2025

new node: blur source #145

Closed

3 tasks

		* shadow-type. A drop-shadow returns a larger integer compared to the
		* box-shadow, so this can be used to dynamically adjust the size and position


		const int shadow_size = drop_shadow_calc_size(scene_shadow->blur_sigma) * data->scale;

		// Optimization: Fallback to a regular box-shadow if the texture is fully opaque

Add drop shadows (CSS drop-shadows) #135

Are you sure you want to change the base?

Add drop shadows (CSS drop-shadows) #135

Uh oh!

Conversation

ErikReider commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

WillPower3309 commented Aug 10, 2025

Uh oh!

ErikReider commented Aug 15, 2025

Uh oh!

ErikReider commented Sep 27, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

WillPower3309 Oct 15, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

WillPower3309 commented Nov 5, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

ErikReider commented Jul 24, 2025 •

edited

Loading

WillPower3309 Oct 15, 2025 •

edited

Loading