Background Pattern 136 - Sparse starfield with left-side mask

Pro

This component, BackgroundPattern136, creates a visually appealing background pattern featuring a masked sparse starfield effect using radial gradients and CSS masking techniques. It is designed to fill the entire screen area and can be customized using additional class names for styling purposes.

Shadcn Background Pattern 136 block

Component data

ID
background-pattern136
Access
pro
Created
Feb 23, 2026
Type
block
Libraries
Radix UI, Base UI, React Aria

Background Pattern 136 block design & features

BackgroundPattern136 is a visually striking component that serves as a decorative section for user interfaces. It effectively combines unique background patterns with innovative visual masking techniques to create a dynamic and engaging aesthetic. The component is designed around a section-based layout, with flexible positioning and styling options through its customizable className property, making it versatile for different design needs.

This shadcn component specializes in creating a left-masked starfield effect that enhances the visual appeal of any application. It leverages dual radial-gradient backgrounds with varying translucency, layered to contribute depth and texture. The component’s standout feature is its ability to seamlessly integrate into existing designs with its configurable background colors and gradient settings, allowing for cohesive branding and theming across applications. By employing a masking gradient that progressively reveals the background design, the component crafts a sense of movement and dimensionality that distinguishes it from typical static sections. With the inclusion of a shadcn block, the component further supports consistent design patterns and streamlined customization.