我使用 tailwind 创建了一个自定义复选框(作为反应项目中的组件)。现在我想在选中之前和选中之后更改复选框的背景颜色。这就是我要的:

我想知道如何更改tailwind.css中的颜色 这是复选框代码:
<div className="check-box">
<input type="checkbox"
value={ value }
id={ id }
name={ name }
onBlur={ onBlur }
className="absolute h-6 w-6 cursor-pointer" onChange={ onChange } />
<div className="bg-xaplink_gray_1 border-2 border- xaplink_gray_3 w-6 h-6 flex flex-shrink-0 justify-center items-center mr-2 focus-within:border-xaplink_black_2">
<svg className="fill-current hidden w-4 h-4 text-xaplink_white pointer-events-none" version="1.1" viewBox="0 0 17 12" xmlns="http://www.w3.org/2000/svg">
<g fill="none" fillRule="evenodd">
<g transform="translate(-9 -11)" fill="#FFFF" fillRule="nonzero">
<path d="m25.576 11.414c0.56558 0.55188 0.56558 1.4439 0 1.9961l-9.404 9.176c-0.28213 0.27529-0.65247 0.41385-1.0228 0.41385-0.37034 0-0.74068-0.13855-1.0228-0.41385l-4.7019-4.588c-0.56584-0.55188-0.56584-1.4442 0-1.9961 …Run Code Online (Sandbox Code Playgroud)