HomeStylesTemplates
StyleKit
StylesAnimationsTemplates
BlogChangelog
  1. Home
  2. /Animations
  3. /Slide Out Right
Back to Animations

Slide Out Right

右侧滑出

Element slides out to the right and disappears. Perfect for closing side panels, drawers, and split-screen exits.

ExitOn ClickBeginnerGPU Accelerated

Preview

Code

Duration

400ms

Easing

cubic-bezier(0.4, 0, 1, 1)

CSS Properties

opacity, transform

Use Cases

  • Side panel closing
  • Drawer menu dismiss
  • Card swipe-to-dismiss
  • Page transition exit

Related Animations

slide-in-leftslide-in-rightfade-out-down

StyleKit

Curated web design styles collection for more beautiful AI-generated websites.

Navigation

StylesTemplatesGuideBlogChangelog

Resources

UI Design PromptsLanding Page PromptsDashboard PromptsTailwind UI PromptsDark Mode UI PromptsGitHub Repository

Stay Updated

By subscribing, you agree to our Privacy Policy and Terms.

(c) 2026 StyleKit. Open Source.

AboutContactPrivacyTermsBuilt with Editorial style