diff --git a/src/pattern-library/components/patterns/FadeComponent.tsx b/src/pattern-library/components/patterns/FadeComponent.tsx
deleted file mode 100644
index 9b946406..00000000
--- a/src/pattern-library/components/patterns/FadeComponent.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import classnames from 'classnames';
-import { useCallback } from 'preact/hooks';
-
-import type { TransitionComponent } from '../../../types';
-
-/**
- * This component is used just to demonstrate the `TransitionComponent`
- * functionality on components supporting it, like `Dialog`.
- */
-const FadeComponent: TransitionComponent = ({
-  children,
-  visible,
-  onTransitionEnd,
-}) => {
-  const handleTransitionEnd = useCallback(
-    () => onTransitionEnd?.(visible ? 'in' : 'out'),
-    [visible, onTransitionEnd]
-  );
-
-  return (
-    <div
-      className={classnames('transition-opacity duration-500', {
-        'opacity-100': visible,
-        'opacity-0': !visible,
-      })}
-      // @ts-expect-error preact uses "ontransitionend" rather than "onTransitionEnd".
-      // eslint-disable-next-line react/no-unknown-property
-      ontransitionend={handleTransitionEnd}
-    >
-      {children}
-    </div>
-  );
-};
-
-export default FadeComponent;
diff --git a/src/pattern-library/components/patterns/feedback/DialogPage.tsx b/src/pattern-library/components/patterns/feedback/DialogPage.tsx
index 2f5b4c6d..a0701ca4 100644
--- a/src/pattern-library/components/patterns/feedback/DialogPage.tsx
+++ b/src/pattern-library/components/patterns/feedback/DialogPage.tsx
@@ -13,13 +13,13 @@ import {
   InputGroup,
   Link,
   Scroll,
+  Slider,
   Tab,
   TabList,
 } from '../../../../';
 import { ModalDialog } from '../../../../components/feedback';
 import type { ModalDialogProps } from '../../../../components/feedback/ModalDialog';
 import Library from '../../Library';
-import FadeComponent from '../FadeComponent';
 import { LoremIpsum, nabokovNovels } from '../samples';
 import type { NabokovNovel } from '../samples';
 
@@ -354,10 +354,10 @@ export default function DialogPage() {
             >
               <Dialog_
                 title="Dialog with TransitionComponent example"
-                transitionComponent={FadeComponent}
+                transitionComponent={Slider}
               >
                 <p>
-                  This dialog has a fade in/out transition when opened/closed.
+                  This dialog has a slide down/up transition when opened/closed.
                 </p>
               </Dialog_>
             </Library.Demo>