{"html":"

\n \n \n

\n TAILWIND\n Cheat Sheet\n

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

\n \n\n

","css":".absolute {\n position: absolute\n}\n\n.relative {\n position: relative\n}\n\n.-bottom-24 {\n bottom: -6rem\n}\n\n.m-1 {\n margin: 0.25rem\n}\n\n.flex {\n display: flex\n}\n\n.h-72 {\n height: 18rem\n}\n\n.h-8 {\n height: 2rem\n}\n\n.w-56 {\n width: 14rem\n}\n\n.w-8 {\n width: 2rem\n}\n\n.cursor-pointer {\n cursor: pointer\n}\n\n.flex-row {\n flex-direction: row\n}\n\n.flex-col {\n flex-direction: column\n}\n\n.justify-between {\n justify-content: space-between\n}\n\n.gap-1 {\n gap: 0.25rem\n}\n\n.overflow-hidden {\n overflow: hidden\n}\n\n.rounded-2xl {\n border-radius: 1rem\n}\n\n.rounded-full {\n border-radius: 9999px\n}\n\n.bg-gray-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(249 250 251 / var(--tw-bg-opacity))\n}\n\n.bg-lime-400 {\n --tw-bg-opacity: 1;\n background-color: rgb(163 230 53 / var(--tw-bg-opacity))\n}\n\n.fill-current {\n fill: currentColor\n}\n\n.stroke-current {\n stroke: currentColor\n}\n\n.p-2 {\n padding: 0.5rem\n}\n\n.p-3 {\n padding: 0.75rem\n}\n\n.text-3xl {\n font-size: 1.875rem;\n line-height: 2.25rem\n}\n\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem\n}\n\n.font-bold {\n font-weight: 700\n}\n\n.text-gray-50 {\n --tw-text-opacity: 1;\n color: rgb(249 250 251 / var(--tw-text-opacity))\n}\n\n.text-gray-800 {\n --tw-text-opacity: 1;\n color: rgb(31 41 55 / var(--tw-text-opacity))\n}\n\n.text-lime-400 {\n --tw-text-opacity: 1;\n color: rgb(163 230 53 / var(--tw-text-opacity))\n}\n\n.text-neutral-800 {\n --tw-text-opacity: 1;\n color: rgb(38 38 38 / var(--tw-text-opacity))\n}\n\n.duration-500 {\n transition-duration: 500ms\n}\n\n.duration-700 {\n transition-duration: 700ms\n}\n\n.hover\\:bg-lime-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(217 249 157 / var(--tw-bg-opacity))\n}\n\n.hover\\:duration-700:hover {\n transition-duration: 700ms\n}\n\n.group:hover .group-hover\\:-bottom-0 {\n bottom: -0px\n}"}

brown-kangaroo-82

👁 实时预览

📝 源代码