@vaadin/vaadin-material-styles
Advanced tools
Vaadin Material is a complete theme for Vaadin components, inspired by Google’s Material Design guidelines.
@vaadin/vaadin-material-styles is a package that provides Material Design inspired styles for Vaadin components. It includes a set of CSS custom properties, mixins, and utility classes that can be used to style web components in a consistent and visually appealing way.
CSS Custom Properties
The package provides a set of CSS custom properties that can be used to apply Material Design colors and styles to elements. For example, you can use `--material-primary-color` to set the primary color of a component.
{ "color": "var(--material-primary-color)" }Typography Styles
It includes typography styles that follow Material Design guidelines. You can use `--material-font-family` to apply the standard font family used in Material Design.
{ "font": "var(--material-font-family)" }Utility Classes
The package offers utility classes like `material-shadow` to easily apply common Material Design effects such as shadows to elements.
<div class="material-shadow">Content</div>Material Components for the web (MDC Web) is a library that provides reusable UI components following Material Design guidelines. It offers a more comprehensive set of components compared to @vaadin/vaadin-material-styles, which focuses on styles and utilities.
Bootstrap is a popular CSS framework that provides design templates for typography, forms, buttons, and other interface components. While it does not specifically follow Material Design guidelines, it offers a wide range of styling options similar to @vaadin/vaadin-material-styles.
Tailwind CSS is a utility-first CSS framework that allows for rapid UI development. It provides a different approach compared to @vaadin/vaadin-material-styles by offering low-level utility classes instead of predefined styles.
vaadin-material-styles is customizable theme for the Vaadin components.
This program is available under Vaadin Commercial License and Service Terms. See https://vaadin.com/commercial-license-and-service-terms for the full license.
FAQs
Vaadin Material is a complete theme for Vaadin components, inspired by Google’s Material Design guidelines.
The npm package @vaadin/vaadin-material-styles receives a total of 125,146 weekly downloads. As such, @vaadin/vaadin-material-styles popularity was classified as popular.
We found that @vaadin/vaadin-material-styles demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 12 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Malicious Ruby gems typosquat Fastlane plugins to steal Telegram bot tokens, messages, and files, exploiting demand after Vietnam’s Telegram ban.
Research
Security News
Socket uncovered four malicious npm packages that exfiltrate up to 85% of a victim’s Ethereum or BSC wallet using obfuscated JavaScript.
Security News
TC39 advances 9 JavaScript proposals, including Array.fromAsync, Error.isError, and Explicit Resource Management, which are now headed into the ECMAScript spec.
