How to use the @chakra-ui/theme.isDarkColor function in @chakra-ui/theme
To help you get started, we’ve selected a few @chakra-ui/theme examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
chakra-ui / chakra-ui / packages / chakra-ui / src / Avatar / styles.ts View on Github 
const useAvatarStyle = ({
size,
name,
showBorder,
borderColor,
}: AvatarOptions) => {
const { colors } = useTheme();
const { colorMode } = useColorMode();
const bg = name ? string2Hex(name) : colors.gray[400];
const color = name ? (isDarkColor(bg) ? "#fff" : "gray.800") : "#fff";
const _borderColor = { light: "#fff", dark: "gray.800" };
const baseProps = {
display: "inline-flex",
rounded: "full",
alignItems: "center",
flexShrink: "0",
justifyContent: "center",
position: "relative",
};
return {
...baseProps,
size: size ? avatarSizes[size] : null,
bg,
color,@chakra-ui/theme
The default theme for chakra components
