Example how to use in Tailwind https://play.tailwindcss.com/9LSkQgkY7p Border gradient rounded and border styled with native tailwind utilities classesButton textBorder gradient with rounded
React Tailwind CSS gradient component 🎭 Theme Generator Shadcn UI theme generator 💸 Stripe Notifier Funny Stripe payment notifications 🖼️ OG Image Generator Social preview generator Gradient WallpapersSign In About Gradient Page 📖 Wallpaper Guide📄 License📜 Terms of Use🕵️♂️...
She has skills in React, JavaScript, Nextjs, Tailwind, MongoDB, Solidity, and more. She loves to learn new technologies and finds writing about them to be a great way to share knowledge with others. In her free time, she enjoys reading thrillers and engaging with the tech community on ...
import { generateTailwindBackground, generateTailwindBorder, generateTailwindRing, generateTailwindText } from './RPanelComponents/gradientUtils'; import { ColorPalette } from './RPanelComponents/ColorPalette'; import { CopyOptions } from './RPanelComponents/CopyOptions'; import { ExportOptions } fr...
text savioxavier •1.1.0•2 years ago•2dependents•MITpublished version1.1.0,2 years ago2dependentslicensed under $MIT 39 boxen Create boxes in the terminal cli box boxes terminal term console ascii unicode border text sindresorhus ...
import { generateTailwindBackground, generateTailwindBorder, generateTailwindRing, generateTailwindText } from './RPanelComponents/gradientUtils'; @@ -6,7 +7,6 @@ import { ColorPalette } from './RPanelComponents/ColorPalette'; import { CopyOptions } from './RPanelComponents/CopyOptions'; impo...
{ + "@types/node": "^18.11.18", + "@types/react": "^18.0.26", + "autoprefixer": "^10.4.13", + "eslint": "^8.30.0", + "postcss": "^8.4.21", + "tailwindcss": "^3.2.4", + "typescript": "^5.0.0" + } +} diff --git a/pages/_app.mdx b/pages/_app.mdx...
// 数値がtailwindwind cssがコンパイルする際に使用出来ないため const gradientColorClassName = gradientColor(id) const gradientColor = ((id) => { switch(id) { case "1": return "custom-orange" case "2": return "custom-blue" case "3": return "custom-yellow" } })(id) return( <...
import type { Config } from "tailwindcss"; const config: Config = { content: [ "./pages/**/*.{js,ts,jsx,tsx,mdx}", "./components/**/*.{js,ts,jsx,tsx,mdx}", "./app/**/*.{js,ts,jsx,tsx,mdx}", ], theme: { extend: { colors: { background: "var(--background)", ...