

Help: similar styling to the context-menu but with a question mark or a ballon next to the arrow. Normally the render cursor is an arrow with a small menu graphic next to the arrow. None: no cursor is shown for the element Links and statusĬontext-menu: can be used when an object is under the cursor.

webkit-zoom-grabbing List of CSS cursors General purposeĪuto: User-agent (UA) decides what to display based on the context, for example it is auto behaves as ‘text’ when over selectable text or editable elements and then ‘default’ otherwiseĭefault: the platform determine the default cursor, typically this is an arrow customcursor Browser-Specific CursorsĪdditionally there is a few browser specific options which are: -webkit-zoom-in You can also add a second custom file with a comma-seperated list and then finally end this list with a generic cusor such as pointer, default or auto, as shown in the example below. How do I add a custom cursor in CSS?īy using the url() value we can display a custom image. From a UX perspective it is essential to utilise this property to convey meaning to the user through visual feedback cues.Īs well as the standard cursors there is custom option which we’ll look at next. Using the correct type of cursors is becoming more important than ever with the increase in web applications. This CSS property is only for devices that use a mouse so it wouldn’t apply to a phone or a tablet because there is no cursor. This will prevent you from accidentally closing out of the Figma file, when you are scrolling left and right within the canvas.The cursor property controls the styling of the mouse cursor that is shown to the user when the mouse is pointing on an element. If you're using the trackpad on macOS, then you may want to disable the left/right swipe gesture. Visit Microsoft's help center for information.

To use Figma on Microsoft Edge, you'll need to make sure the Strict Mode setting is disabled for.

