import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
import "react-multi-date-picker/styles/colors/green.css"
.
.
.
<DatePicker 
  className="green"
  calendar={persian}
  locale={persian_fa}
  calendarPosition="bottom-right"
/>

import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
import "react-multi-date-picker/styles/colors/red.css"
.
.
.
<DatePicker 
  className="red"
  calendar={persian}
  locale={persian_fa}
  calendarPosition="bottom-right"
/>

import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
import "react-multi-date-picker/styles/colors/yellow.css"
.
.
.
<DatePicker 
  className="yellow"
  calendar={persian}
  locale={persian_fa}
  calendarPosition="bottom-right"
/>

import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
import "react-multi-date-picker/styles/colors/purple.css"
.
.
.
<DatePicker 
  className="purple"
  calendar={persian}
  locale={persian_fa}
  calendarPosition="bottom-right"
/>

import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
import "react-multi-date-picker/styles/colors/teal.css"
.
.
.
<DatePicker 
  className="teal"
  calendar={persian}
  locale={persian_fa}
  calendarPosition="bottom-right"
/>

import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
import "react-multi-date-picker/styles/backgrounds/bg-dark.css"
.
.
.
<DatePicker 
  className="bg-dark"
  calendar={persian}
  locale={persian_fa}
  calendarPosition="bottom-right"
/>

import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
import "react-multi-date-picker/styles/backgrounds/bg-gray.css"
.
.
.
<DatePicker 
  className="bg-gray"
  calendar={persian}
  locale={persian_fa}
  calendarPosition="bottom-right"
/>

import persian from "react-date-object/calendars/persian"
import persian_fa from "react-date-object/locales/persian_fa"
.
.
.
import "react-multi-date-picker/styles/backgrounds/bg-brown.css"
.
.
.
<DatePicker 
  className="bg-brown"
  calendar={persian}
  locale={persian_fa}
  calendarPosition="bottom-right"
/>