Settings Profile 8 - Two-column labeled form rowsPro
A shadcn-style settings form where every row pairs a label and helper text on the left with its control on the right, separated by hairline dividers. Use it for dense profile or workspace settings pages that need scannable labels.
About Settings Profile 8
A shadcn-style settings form where every row pairs a label and helper text on the left with its control on the right, separated by hairline dividers. Use it for dense profile or workspace settings pages that need scannable labels.
Settings Profile 8 is a settings profile block for React and Tailwind CSS, included in Chocolate UI Pro. It ships as 101 lines of TypeScript you own: every piece of copy is a prop with a sensible default, so you can drop it in and replace the content without touching the layout.
- settings
- form
- two-column
- rows
- profile
- select
Installation
- Set up your project with
npx chocolateui initandnpx chocolateui login(see the installation guide). - Run the Chocolate UI CLI:
npx chocolateui add settings-profile-08Uses: avatar, button, input, label, reveal, select, textarea, utils.
Usage
import SettingsProfile08 from "@/components/blocks/settings-profile-08"
export default function Page() {
return <SettingsProfile08 />
}