This example demonstrates a dual-range slider interface for filtering numeric attributes. It displays two sets of sliders and corresponding numerical inputs for "HP" and "ATK" values, allowing users to set minimum and maximum thresholds. The sliders use HTML `input[type=range]` elements alongside `input[type=number]` fields, synchronized via event handlers. JavaScript functions like `controlFromSlider` and `fillSlider` manage the interaction, updating a gradient background to visually indicate the selected range. The code also tracks the current range values in a `num_range` object, providing a simple, interactive filtering mechanism for data exploration.