Nextui

npm install @nextui-org/react

Source: nextui.org

Nextui

import { createTheme } from '@nextui-org/react';

const lightTheme = createTheme({
  type: 'light',
});

return (
  <ShopCard className={lightTheme} />
);


const darkTheme = createTheme({
  type: 'dark',
});

return (
  <ShopCard className={darkTheme} />
);



const lightModernTheme = createTheme({
  type: 'light',
  className: 'light-modern',
  theme: {
    colors: {
      primary: '#7928CA',
      primaryLight: '#d9c2f0',
      success: '#FF1CF7'
    }
  }
});

return (
  <ShopCard className={lightModernTheme}/>
)

const darkModernTheme = createTheme({
  type: 'dark',
  className: 'dark-modern',
  theme: {
    colors: {
      primary: '#7928CA',
      primaryLight: '#582A87',
      success: '#FF1CF7'
    }
  }
});

return (
  <ShopCard className={darkModernTheme} />
);

const lightElegantTheme = createTheme({
  type: 'light',
  className: 'light-elegant',
  theme: {
    colors: {
      primary: '#000000',
      primaryLight: '#AAAAAA',
      success: '#a2a2a2'
    },
    radii: {
      md: '4px'
    }
  }
});

return (
  <ShopCard className={lightElegantTheme}/>
);

const darkElegantTheme = createTheme({
  type: 'dark',
  className: 'dark-elegant',
  theme: {
    colors: {
      primary: '#ffffff',
      primaryLight: '#222222',
      success: '#a2a2a2'
    },
    radii: {
      md: '4px'
    }
  }
});

return (
  <ShopCard className={darkElegantTheme}/>
);


const lightRetroTheme = createTheme({
  type: 'light',
  className: 'light-retro',
  theme: {
    colors: {
      primary: '#FFD34E',
      primaryLight: 'transparent',
      error: '#EE457E'
    }
  }
});

return (
  <ShopCard className={lightRetroTheme}/>
);

const darkRetroTheme = createTheme({
  type: 'dark',
  className: 'dark-retro',
  theme: {
    colors: {
      primary: '#FFD34E',
      primaryLight: 'transparent',
      error: '#EE457E'
    }
  }
});

return (
  <ShopCard className={darkRetroTheme}/>
);

Source: nextui.org

Similar codes

0 vote386 views1 answer
Conda install boto3
Shell/Bash
2 votes321 views1 answer
Whatsapp web for ubuntu
Shell/Bash
0 vote329 views1 answer
Run screen on background linux terminal
Shell/Bash
0 vote348 views1 answer
Change root directory command prompt
Shell/Bash
25 votes357 views3 answers
Git cherry picking
Shell/Bash
39 votes323 views6 answers
Snap install
Shell/Bash
34 votes323 views6 answers
Update cypress
Shell/Bash
0 vote409 views1 answer
Cat along with line numbers
Shell/Bash
1 vote319 views1 answer
Delete network linux
Shell/Bash
0 vote329 views1 answer
Remove All Local Branches not on Remote
Shell/Bash