Open In App

Spectre Cursor utilities

Improve
Improve
Like Article
Like
Save
Share
Report

Spectre Cursor utilities are spectre classes that specify the mouse cursor which is displayed when mouseover is performed by the user or while pointing at an element. In CSS, refer to the CSS cursor property for a better understanding

Spectre Cursor utility class:

  • c-hand: This class is used to make the cursor into a hand sign.
  • c-move: This class is used to make the cursor into a moving sign.
  • c-zoom-in: This class is used to make the cursor into a zoom-in (plus in magnifier) sign.
  • c-zoom-out: This class is used to make the cursor into a zoom-out (minus in magnifier) sign.
  • c-not-allowed: This class is used to make the cursor into the not-allowed sign.
  • c-auto: This class is used to make the cursor into the auto sign.

Syntax:

<div class="c-hand">
   ....
</div>

Example: Below example illustrate the Spectre Cursor utilities.

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>SPECTRE Cursor Class</title>
    <link rel="stylesheet" href=
    <link rel="stylesheet" href=
    <link rel="stylesheet" href=
</head>
  
<body>
    <center>
        <h1 class="text-success">GeeksforGeeks</h1>
        <strong>SPECTRE Cursor Class</strong>
        <br><br>
    </center>
    <div class="container">
        <div class="bg-success c-hand">
            The cursor is hand
        </div>
        <br>
        <div class="bg-success c-move">
             The cursor is move
        </div>
        <br>
        <div class="bg-success c-zoom-in">
            The cursor is zoom-in
        </div>
        <br>
        <div class="bg-success c-zoom-out">
            The cursor is zoom-out
        </div>
        <br>
        <div class="bg-success c-not-allowed">
           The cursor is not-allowed
        </div>
        <br>
        <div class="bg-success c-auto">
            The cursor is auto
        </div>
    </div>
</body>
</html>


Output:

Spectre Cursor utilities

Spectre Cursor utilities

Reference: https://picturepan2.github.io/spectre/utilities/cursors.html



Last Updated : 07 Feb, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads