ArtificialSenseDocs

Docs / Components

SenseImageCompareComponent

Before/after image comparison controlled by a native range slider from @artificialsenselabs/ui. The vertical divider is decorative — keyboard and pointer users move the range control (Arrow / Home / End / Page keys).

Live demo: run nx serve showcase and open /components/image-compare (port 4202).

Overview

Category: Media. Selector: sense-image-compare. Import: import { SenseImageCompareComponent } from '@artificialsenselabs/ui';

Accessibility

  • Motor / keyboard alternative is the native type="range" (not a custom drag-only handle).
  • Localized aria-label plus aria-valuetext for the current percent.
  • Provide meaningful leftAlt / rightAlt when each image is informative.
ArtificialSense

AI-Native Enterprise Engineering Studio

© ArtificialSense · @artificialsenselabs/ui (MIT) & @artificialsenselabs/enterprise (Elastic License 2.0)

Privacy & telemetry

We use optional telemetry to catch production errors and measure real-user performance. Those scripts load only after you choose. Our host also runs cookieless aggregate page analytics — see the privacy policy.