@consent/avatar v1.0.0-alpha.5

@consent/avatar

A circular image representing one person

Usage

npm -i @consent/avatar

• NPM
• UNPKG

React

import Avatar from "@consent/avatar";
import "@consent/avatar.css";

<Avatar
  src="path/to/avatar.png"
  alt="some avatar"
  size={4}
  inset={true}
/>;

CSS

First, link the stylesheet, relative to your platform.

<span class="Avatar Avatar--size_4 Avatar--inset_true">
  <img src="path/to/avatar.png" alt="some avatar" />
</span>

Properties

size: string | number

Controls size in 8px increments.

values: 3, 4, 5, 6, 7, 8, 9, "20px", "profile"

inset: boolean

Insets the component

Theming with CSS Custom Properties

:root {
  --consent-avatar-inset-color: white;
}