Code Comparison

Pro

Two code snippets side by side, for before-and-after diffs.

Customize

This item has no props to tune. Use the lens above to change theme, density, direction and more.


pnpm dlx shadcn@latest add @tealmac-pro/code-comparison

Prop	Type	Default	Description
`className`	`string`	`-`	The class name to be applied to the component
`beforeCode`	`string`	`-`	The code snippet to display in the "before" section
`afterCode`	`string`	`-`	The code snippet to display in the "after" section
`language`	`string`	`-`	The language of the code snippets (e.g., "typescript")
`filename`	`string`	`-`	The filename to display for the code snippets
`lightTheme`	`string`	`github-light`	The theme to use for light mode
`darkTheme`	`string`	`github-dark`	The theme to use for dark mode
`highlightColor`	`string`	`rgba(101, 117, 133, 0.16)`	The color to use for highlighting the code snippets