# EclBannerComponent

**Type:** component



Component representing a banner, which can contain image, video and call-to-action (CTA) links.
Allows customization of layout, alignment, and appearance through inputs.


**Selector:** `ecl-banner`

## Inputs
- **boxBackground**: `"none" | "light" | "dark" | string` - Defines the background color of the banner content box. Allowed values: 'none' | 'light' | 'dark'. Default: 'light'.
- **copyright**: `string` - Sets the copyright text displayed in the banner.
- **eclSize**: `"xs" | "s" | "m" | "l" | string` - Defines the size of the banner. Affects its height-to-width aspect ratio. Allowed values: 'xs' | 's' | 'm' | 'l'. Default: 'm'.
- **fontColor**: `"light" | "dark" | string` - Defines the color of the font inside the banner content box. Allowed values: 'light' | 'dark'. Default: 'dark'.
- **fontSize**: `"s" | "m" | "l" | string` - Defines the font size inside the banner content box. Allowed values: 'm' | 'l'. Default: 'm'.
- **horizontalAlignment**: `"right" | "left" | "center" | string` - Sets the horizontal alignment of the content inside the banner. Allowed values: 'left' | 'center' | 'right'. Default: 'left'.
- **isFullWidth**: `boolean` - When true, the banner stretches to full width of its container. Default: false.
- **verticalAlignment**: `"top" | "center" | "bottom" | string` - Sets the vertical alignment of the content inside the banner. Allowed values: 'top' | 'center' | 'bottom'. Default: 'center'.
- **class**: `string` - 
- **e2eAttr**: `any` - 
- **tabindex**: `number` - 
