1.0.11 • Published 4 years ago
@privy-eng/theme v1.0.11
@privy-eng/theme
styled-components
theme for Privy - https://styled-components.com
Usage
import theme from '@privy-eng/theme';
...
<ThemeProvider theme={theme}>
...
</ThemeProvider>
Example usage with styled-components
const StyledButton = styled.button`
...
background: ${({ theme }) => theme.darkestPurple};
`;
Privys styled-components Theme
{
/*--- FONTS ---*/
openSansFamily: `'Libre Franklin', 'Helvetica Neue', Helvetica, Arial, sans-serif`,
monospaceFamily: `Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace`,
/*--- TRANSITIONS ---*/
easeAll: `all 0.2s ease`,
easeAll300: `all 0.3s ease`,
/*--- PRIMARY COLORS ---*/
darkestPurple: `#222A4C`,
darkerPurple: `#29335C`,
darkPurple: `#434A88`,
purple: `#6465AF`,
lightPurple: `#ECEEF2`,
lighterPurple: `#8E959F`,
warmDarkPurple: `#354876`,
teal: `#24B9AF`,
darkTeal: `#197278`,
lightTeal: `#00B3AF`,
green: `#3F937E`,
orange: `#F3A712`,
red: `#C44536`,
coral: `#EF6544`,
/*--- BACKGROUND COLORS ---*/
beige: `#EFF0F4`,
lightGray: `#FCFCFF`,
gray4: `#D0D5D8`,
seaweed: `#1E7F8A`,
nickel: `#757270`,
rose: `#DF2935`,
mango: `#FFB630`,
transparentGray: `rgba(239, 240, 244, 0.64)`,
/*--- BORDER COLORS ---*/
beige2: `#B6BDC7`,
beige3: `#E9EBEF`,
/*--- TEXT COLORS ---*/
gray: `#393E41`, // #555F66, // default text color
gray2: `#545D68`, // #75838a, // for light text on beige bg
gray3: `#737D89`, // #B0B7B8, // for light text on white bg
white: `#fdfdfd`,
olive: `#403f37`
};
1.0.11
4 years ago
1.0.9
4 years ago
1.0.11-alpha.0
4 years ago
1.0.11-alpha.1
4 years ago
1.0.10
4 years ago
1.0.8
4 years ago
1.0.7
4 years ago
1.0.6
4 years ago
1.0.5
4 years ago
1.0.4
4 years ago
1.0.2
4 years ago
1.0.2-test
4 years ago
1.0.3
4 years ago
1.0.1
4 years ago
1.0.0
4 years ago