Custom Cursor

css content classes cursor

Add a custom cursor

Emil Hvitfeldt true

A custom cursor can be used if you want a little better highlighting on a specific slide or plot.

We use a content class and a .png file to create a custom cursor.



    css: ["default", "style.css"]
    lib_dir: libs
    seal: FALSE
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false

class: custom-cursor

# Sample Header

Duis vel viverra elit, eget hendrerit odio.
Curabitur cursus elit nec diam vulputate, nec 
sollicitudin nunc ornare. Ut mi lectus, aliquet 
non ligula sed, lobortis vehicula erat. Morbi 
porttitor orci ut semper dapibus. Donec sodales 
tellus varius tortor varius, ornare commodo augue 
maximus. Vestibulum quisbibendum mi, sit amet 
lobortis leo. Morbi vulputate orci arcu, ac lobortis
sapien gravida eget. Nulla noninterdum orci, nec 
congue ligula.


.custom-cursor {
  cursor: url('cursor.png'), auto;


Text and figures are licensed under Creative Commons Attribution CC BY 4.0. The figures that have been reused from other sources don't fall under this license and can be recognized by a note in their caption: "Figure from ...".


For attribution, please cite this work as

Hvitfeldt (2021, May 22). Xaringan Gallery: Custom Cursor. Retrieved from

BibTeX citation

  author = {Hvitfeldt, Emil},
  title = {Xaringan Gallery: Custom Cursor},
  url = {},
  year = {2021}