Nest Carousel

React UI library for marketplace created by Nest design team.

Getting Started

$ npm i @nest-ui/carousel @emotion/react@^11.10.4

Basic usage

import { Carousel } from '@nest-ui/carousel';

const App = () => {
  return (
    <div css={{ width: '100%', border: '1px solid #eee', overflow: 'hidden' }}>
      <p css={{ fontSize: '10px', textAlign: 'center' }}>swipe or drag with mouse</p>
      <Carousel>
        <img
          alt=""
          css={{ width: '100%', height: 300, objectFit: 'cover', display: 'block' }}
          src="https://picsum.photos/seed/1/1280/768.webp"
        />
        <img
          alt=""
          css={{ width: '100%', height: 300, objectFit: 'cover', display: 'block' }}
          src="https://picsum.photos/seed/2/1280/768.webp"
        />
        <img
          alt=""
          css={{ width: '100%', height: 300, objectFit: 'cover', display: 'block' }}
          src="https://picsum.photos/seed/3/1280/768.webp"
        />
      </Carousel>
    </div>
  );
};

Showcase

Comming soon...

Future ideas

TBH...