HomeStylesTemplates
StyleKit
StylesAnimationsTemplates
BlogChangelog
  1. Home
  2. /Animations
  3. /Flip Card
Back to Animations

Flip Card

3D 卡片翻转

Card flips along the Y-axis in 3D space to reveal back content. Requires a perspective container and backface-visibility control.

HoverOn HoverAdvancedGPU Accelerated

Preview

Code

Duration

600ms

Easing

ease-in-out

CSS Properties

transform

Use Cases

  • Team member profile cards
  • Product feature reveal
  • FAQ toggle cards
  • Interactive info cards

Related Animations

hover-lifthover-glow

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