@productshiv/baapui
Version:
A truly cross-platform multi-design UI framework that works with React, Next.js, React Native, and any React-based framework.
92 lines (90 loc) • 1.81 kB
text/typescript
import { Theme } from '../types';
export const flatLightTheme: Theme = {
mode: 'light',
design: 'flat',
colors: {
primary: '#007AFF',
secondary: '#5856D6',
background: '#FFFFFF',
surface: '#F2F2F7',
text: '#000000',
textSecondary: '#8E8E93',
border: '#C7C7CC',
error: '#FF3B30',
success: '#34C759',
warning: '#FF9500',
info: '#5856D6',
lightShadow: '#FFFFFF',
darkShadow: '#000000',
},
shadows: {
small: {
shadowColor: '#000000',
shadowOffset: { width: 0, height: 1 },
shadowOpacity: 0.18,
shadowRadius: 1.0,
elevation: 1,
},
medium: {
shadowColor: '#000000',
shadowOffset: { width: 0, height: 2 },
shadowOpacity: 0.25,
shadowRadius: 3.84,
elevation: 3,
},
large: {
shadowColor: '#000000',
shadowOffset: { width: 0, height: 4 },
shadowOpacity: 0.3,
shadowRadius: 4.65,
elevation: 5,
},
},
spacing: {
xs: 4,
sm: 8,
md: 16,
lg: 24,
xl: 32,
},
typography: {
h1: {
fontSize: 34,
fontWeight: 'bold',
letterSpacing: 0.37,
},
h2: {
fontSize: 28,
fontWeight: '600',
letterSpacing: 0.35,
},
h3: {
fontSize: 22,
fontWeight: '600',
letterSpacing: 0.35,
},
body: {
fontSize: 17,
fontWeight: 'normal',
letterSpacing: -0.41,
},
button: {
fontSize: 17,
fontWeight: '600',
letterSpacing: -0.41,
},
caption: {
fontSize: 12,
fontWeight: 'normal',
letterSpacing: 0,
},
},
shape: {
borderRadius: {
sm: 4,
md: 8,
lg: 12,
full: 9999,
},
},
};