How to make a border-radius for Skeleton by react-loading-skeleton?

Question

I need to create Skeleton using the react-loading-skeleton library. One item should have border radius like at the picture below.

Do you know how to make it?

My lib version: "react-loading-skeleton": "1.2.0" (low possibility of upgrade)

I tried to solve it in this way, but it doesn't work :(

<Skeleton
    width={127}
    borderRadius={12.5}
/>

Answer 1

Use a wrapper like this :

.rounded-skeleton {
  border-radius: 200px;
  overflow: hidden;
}

JSX:

  <div className="rounded-skeleton">
    <Skeleton />
  </div>

CodeSandbox here