FRAMEWORK REFERENCE / ADVANCED INDEX

Motion catalogue

Search and preview all 268 named motion presets in the current Xshna.css distribution.

Search named presets268 presets

All shipped presets are listed below. Press Preview to apply only that animation. Use the optional motion stylesheet if you are assembling modular assets. Honor the user’s reduced-motion preference.

LIVE MOTION PREVIEW

Xshna

Choose a motion preset.

xsh-motion-entrance-01

xsh-motion-entrance-02

xsh-motion-entrance-03

xsh-motion-entrance-04

xsh-motion-entrance-05

xsh-motion-entrance-06

xsh-motion-entrance-07

xsh-motion-entrance-08

xsh-motion-entrance-09

xsh-motion-entrance-10

xsh-motion-entrance-11

xsh-motion-entrance-12

xsh-motion-entrance-13

xsh-motion-entrance-14

xsh-motion-entrance-15

xsh-motion-entrance-16

xsh-motion-entrance-17

xsh-motion-entrance-18

xsh-motion-entrance-19

xsh-motion-entrance-20

xsh-motion-entrance-21

xsh-motion-entrance-22

xsh-motion-entrance-23

xsh-motion-entrance-24

xsh-motion-entrance-25

xsh-motion-entrance-26

xsh-motion-entrance-27

xsh-motion-entrance-28

xsh-motion-entrance-29

xsh-motion-entrance-30

xsh-motion-entrance-31

xsh-motion-entrance-32

xsh-motion-entrance-33

xsh-motion-entrance-34

xsh-motion-entrance-35

xsh-motion-exit-01

xsh-motion-exit-02

xsh-motion-exit-03

xsh-motion-exit-04

xsh-motion-exit-05

xsh-motion-exit-06

xsh-motion-exit-07

xsh-motion-exit-08

xsh-motion-exit-09

xsh-motion-exit-10

xsh-motion-exit-11

xsh-motion-exit-12

xsh-motion-exit-13

xsh-motion-exit-14

xsh-motion-exit-15

xsh-motion-exit-16

xsh-motion-exit-17

xsh-motion-exit-18

xsh-motion-exit-19

xsh-motion-exit-20

xsh-motion-exit-21

xsh-motion-exit-22

xsh-motion-exit-23

xsh-motion-exit-24

xsh-motion-exit-25

xsh-motion-emphasis-01

xsh-motion-emphasis-02

xsh-motion-emphasis-03

xsh-motion-emphasis-04

xsh-motion-emphasis-05

xsh-motion-emphasis-06

xsh-motion-emphasis-07

xsh-motion-emphasis-08

xsh-motion-emphasis-09

xsh-motion-emphasis-10

xsh-motion-emphasis-11

xsh-motion-emphasis-12

xsh-motion-emphasis-13

xsh-motion-emphasis-14

xsh-motion-emphasis-15

xsh-motion-emphasis-16

xsh-motion-emphasis-17

xsh-motion-emphasis-18

xsh-motion-emphasis-19

xsh-motion-emphasis-20

xsh-motion-emphasis-21

xsh-motion-emphasis-22

xsh-motion-emphasis-23

xsh-motion-emphasis-24

xsh-motion-emphasis-25

xsh-motion-emphasis-26

xsh-motion-hover-01

xsh-motion-hover-02

xsh-motion-hover-03

xsh-motion-hover-04

xsh-motion-hover-05

xsh-motion-hover-06

xsh-motion-hover-07

xsh-motion-hover-08

xsh-motion-hover-09

xsh-motion-hover-10

xsh-motion-hover-11

xsh-motion-hover-12

xsh-motion-hover-13

xsh-motion-hover-14

xsh-motion-hover-15

xsh-motion-hover-16

xsh-motion-hover-17

xsh-motion-hover-18

xsh-motion-hover-19

xsh-motion-hover-20

xsh-motion-hover-21

xsh-motion-hover-22

xsh-motion-hover-23

xsh-motion-hover-24

xsh-motion-hover-25

xsh-motion-press-01

xsh-motion-press-02

xsh-motion-press-03

xsh-motion-press-04

xsh-motion-press-05

xsh-motion-press-06

xsh-motion-press-07

xsh-motion-press-08

xsh-motion-press-09

xsh-motion-press-10

xsh-motion-press-11

xsh-motion-press-12

xsh-motion-loading-01

xsh-motion-loading-02

xsh-motion-loading-03

xsh-motion-loading-04

xsh-motion-loading-05

xsh-motion-loading-06

xsh-motion-loading-07

xsh-motion-loading-08

xsh-motion-loading-09

xsh-motion-loading-10

xsh-motion-loading-11

xsh-motion-loading-12

xsh-motion-loading-13

xsh-motion-loading-14

xsh-motion-loading-15

xsh-motion-loading-16

xsh-motion-loading-17

xsh-motion-loading-18

xsh-motion-loading-19

xsh-motion-loading-20

xsh-motion-loading-21

xsh-motion-loading-22

xsh-motion-loading-23

xsh-motion-loading-24

xsh-motion-loading-25

xsh-motion-loading-26

xsh-motion-loading-27

xsh-motion-loading-28

xsh-motion-loading-29

xsh-motion-loading-30

xsh-motion-typography-01

xsh-motion-typography-02

xsh-motion-typography-03

xsh-motion-typography-04

xsh-motion-typography-05

xsh-motion-typography-06

xsh-motion-typography-07

xsh-motion-typography-08

xsh-motion-typography-09

xsh-motion-typography-10

xsh-motion-typography-11

xsh-motion-typography-12

xsh-motion-typography-13

xsh-motion-typography-14

xsh-motion-typography-15

xsh-motion-typography-16

xsh-motion-typography-17

xsh-motion-typography-18

xsh-motion-typography-19

xsh-motion-typography-20

xsh-motion-scroll-01

xsh-motion-scroll-02

xsh-motion-scroll-03

xsh-motion-scroll-04

xsh-motion-scroll-05

xsh-motion-scroll-06

xsh-motion-scroll-07

xsh-motion-scroll-08

xsh-motion-scroll-09

xsh-motion-scroll-10

xsh-motion-scroll-11

xsh-motion-scroll-12

xsh-motion-scroll-13

xsh-motion-scroll-14

xsh-motion-scroll-15

xsh-motion-scroll-16

xsh-motion-scroll-17

xsh-motion-scroll-18

xsh-motion-scroll-19

xsh-motion-scroll-20

xsh-motion-scroll-21

xsh-motion-scroll-22

xsh-motion-scroll-23

xsh-motion-scroll-24

xsh-motion-page-01

xsh-motion-page-02

xsh-motion-page-03

xsh-motion-page-04

xsh-motion-page-05

xsh-motion-page-06

xsh-motion-page-07

xsh-motion-page-08

xsh-motion-page-09

xsh-motion-page-10

xsh-motion-page-11

xsh-motion-page-12

xsh-motion-page-13

xsh-motion-page-14

xsh-motion-page-15

xsh-motion-sequence-01

xsh-motion-sequence-02

xsh-motion-sequence-03

xsh-motion-sequence-04

xsh-motion-sequence-05

xsh-motion-sequence-06

xsh-motion-sequence-07

xsh-motion-sequence-08

xsh-motion-sequence-09

xsh-motion-sequence-10

xsh-motion-sequence-11

xsh-motion-sequence-12

xsh-motion-sequence-13

xsh-motion-sequence-14

xsh-motion-sequence-15

xsh-motion-sequence-16

xsh-motion-svg-01

xsh-motion-svg-02

xsh-motion-svg-03

xsh-motion-svg-04

xsh-motion-svg-05

xsh-motion-svg-06

xsh-motion-svg-07

xsh-motion-svg-08

xsh-motion-svg-09

xsh-motion-svg-10

xsh-motion-svg-11

xsh-motion-svg-12

xsh-motion-data-01

xsh-motion-data-02

xsh-motion-data-03

xsh-motion-data-04

xsh-motion-data-05

xsh-motion-data-06

xsh-motion-data-07

xsh-motion-data-08

xsh-motion-data-09

xsh-motion-data-10

xsh-motion-data-11

xsh-motion-data-12

xsh-motion-spatial-01

xsh-motion-spatial-02

xsh-motion-spatial-03

xsh-motion-spatial-04

xsh-motion-spatial-05

xsh-motion-spatial-06

xsh-motion-spatial-07

xsh-motion-spatial-08

xsh-motion-spatial-09

xsh-motion-spatial-10

xsh-motion-spatial-11

xsh-motion-spatial-12

xsh-motion-spatial-13

xsh-motion-spatial-14

xsh-motion-spatial-15

xsh-motion-spatial-16