// Component added by Ansh - github.com/ansh-dhanani
import GradualBlur from '@/components/ui/gradual-blur';
function ExampleSection() {
return (
<section style={{ position: 'relative', height: 500, overflow: 'hidden' }}>
<div style={{ height: '100%', overflowY: 'auto', padding: '6rem 2rem' }}>
<img
src="https://cdn.21st.dev/assets/mirror/0a/0afd7457a311e54c7baf509f3a91e716b1198e2573aaf6336982ea6a4bdfcf3d.jpg"
alt="Unsplash example"
style={{ width: '100%', height: 'auto', borderRadius: '0.5rem' }}
/>
</div>
<GradualBlur
target="parent"
position="bottom"
height="6rem"
strength={2}
divCount={5}
curve="bezier"
exponential={true}
opacity={1}
/>
</section>
);
}
export default ExampleSection;