160657 2016-08-08 04:33:12 -0700 Custom CSS cursor (any format) is blurry, especially with a large OS X system cursor size 2023-03-31 18:55:38 -0700 1 1 1 Unclassified WebKit CSS WebKit Nightly Build Mac Unspecified NEW https://bugs.webkit.org/show_bug.cgi?id=254197 BrowserCompat, InRadar P2 Normal --- 1 seriouslyicy webkit-unassigned ahmad.saleem792 bulubin8 dino jonlee karlcow simon.fraser webkit-bug-importer oldest_to_newest 1218479 0 285563 seriouslyicy 2016-08-08 04:33:12 -0700 Created attachment 285563 A ZIP file containing a demonstration of the problem This might be the same issue as https://bugs.chromium.org/p/chromium/issues/detail?id=325565 but I think it's different enough to warrant discussion here. I have searched and was unabled to find any other similar issues. I have tested in Chrome 51 on OSX 10.11, Safari 9.1 on OSX 10.11, and Chrome 53 on Windows 10. (My devicePixelRatio on OS X is 2 - a retina screen.) This does not happen in Firefox 47 or 48 on OSX 10.11, but a variant happens in Firefox 48 on Windows 10. (I wasn't able to get custom cursors to work at all in IE 11 or Edge 13 - may have been an issue with the cursor size being too big.) Basically, it looks like custom cursors get rendered to a raster and scaled up, resulting in aliasing. On Macs (but not on Windows) changing the cursor size in the system preferences (Accessibility > Cursor size) causes custom cursors to display bigger, which makes the problem much more obvious. You can see this particularly in the lines crossing the target in the attached example; they should be sharp black lines with white edges, but instead they're just a muddled gray. I have confirmed that the image can be made slightly crisper by changing the size to 63x63px instead of 64x64px so that the cross-lines are aligned on a single pixel. Additionally, viewing the SVG image directly in a Webkit browser renders it crisply. For an illustration, compare the attached demo in Webkit and Firefox on OS X. In Firefox it's crisp and in Webkit it's blurry. The left pane in the demo uses an SVG cursor and the right pane uses a CUR cursor; both exhibit the same behavior. 1218480 1 seriouslyicy 2016-08-08 04:44:55 -0700 Oops, the attached demo actually uses the SVG cursor in both panes, but you can change the index.html source to see that the same effect happens regardless of cursor format (just change "cursor.svg" to "cursor.cur"). 1218673 2 jonlee 2016-08-08 18:31:00 -0700 rdar://problem/10413916 1945883 3 ahmad.saleem792 2023-03-31 18:55:38 -0700 From below Blink Commit - https://chromium.googlesource.com/chromium/src.git/+/463f5a9838f4352dd4ab3c7aae8a9d32ee7fd26b We can merge this part but SVGImage.cpp and SVGImage.h changes are related to Skia library and I don't know whether we can merge it 1-1. EventHandler.cpp: https://searchfox.org/wubkat/source/Source/WebCore/page/EventHandler.cpp#1543 285563 2016-08-08 04:33:12 -0700 2016-08-08 04:33:12 -0700 A ZIP file containing a demonstration of the problem cursor-problem.zip application/zip 6313 seriouslyicy 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