Elevation and Shadows

Elevation and shadows play a key role in communicating hierarchy and depth in modern user interfaces. By simulating how objects exist in physical space, they help users quickly understand which elements are interactive, layered, or currently in focus. Subtle shadows can guide attention, separate components, and improve visual clarity without adding extra visual noise. When used consistently, elevation also reinforces intuitive interactions such as hovering, pressing, or dragging elements. In BCQ we support 12 types of elevation, which are part of our utility CSS classes.

Becquerel UI for Vue3

The Vue3 UI library developed by us at brandcompete GmbH provides a comprehensive and growing set of tools for building modern, consistent user interfaces

Getting Started
Quick Start
Development
Publishing
Deployment
Roadmap
Release Notes
Bundler
Content
Theme
App
Layout
Heading
Container
Grid
Table Layout
Colors
Brand Color
Elevation
Reactive Style
Typography
CSS Variables
Utility CSS Classes
CSS Animations
Lorem Ipsum
Navigator Online
UI
Alert
Ambient Image
Avatar
Avatar Group
Badge
Banner
Breadcrumbs
Btn
Btn Group
Card
Chip
Color Picker
Collapsible
Context Menu
Data Table
Dialog Box
Divider
Editor
Empty
Flag
Icon
Kbd
Kpi
Lazy Image
List
Loading Overlay
Meter Group
Multiline Ellipsis
Notification
Pager
Progressbar
Rating
Skeleton Loader
Snackbar
Sparklines
Speed Dial
Split Btn
SVG Icon
Tabs
Timeline
Toolbar
Tooltip
Treeview
Vid
Forms
Async Form
Checkbox
Dropdown
Radio Group
Range Slider
Slider
Switcher
Text Field
Upload
Directives
Aspect Ratio
Blur
Default Btn
Gradient Text
Intersect
Liquid Glass
Resize
Ripple
Scroll Lock
Tooltip
Sitemap