Theming documentation for Password component
List of class names used in the styled mode.
| className | description |
|---|---|
| p-password | Class name of the root element |
| p-password-input | Class name of the input element |
| p-password-strength | Class name of the strength element |
| p-password-meter | Class name of the meter element |
| p-password-overlay | Class name of the panel element |
| p-password-clear-icon | Class name of the clear icon element |
List of design tokens.
| token | CSS Variable | description |
|---|---|---|
| password.meter.background | --p-password-meter-background | Background of meter |
| password.meter.border.radius | --p-password-meter-border-radius | Border radius of meter |
| password.meter.height | --p-password-meter-height | Height of meter |
| password.icon.color | --p-password-icon-color | Color of icon |
| password.overlay.background | --p-password-overlay-background | Background of overlay |
| password.overlay.border.color | --p-password-overlay-border-color | Border color of overlay |
| password.overlay.border.radius | --p-password-overlay-border-radius | Border radius of overlay |
| password.overlay.color | --p-password-overlay-color | Color of overlay |
| password.overlay.padding | --p-password-overlay-padding | Padding of overlay |
| password.overlay.shadow | --p-password-overlay-shadow | Shadow of overlay |
| password.content.gap | --p-password-content-gap | Gap of content |
| password.strength.weak.background | --p-password-strength-weak-background | Weak background of strength |
| password.strength.medium.background | --p-password-strength-medium-background | Medium background of strength |
| password.strength.strong.background | --p-password-strength-strong-background | Strong background of strength |
Theming is implemented with the pass through properties in unstyled mode.