# code-snippets/3.10.0-beta.1/js/components/common/icons/ViewIcons.tsx

Code Snippets, version 3.10.0-beta.1. 35 lines.

- Page: https://pluginprobe.com/plugins/code-snippets/3.10.0-beta.1/code/js/components/common/icons/ViewIcons.tsx
- Raw: https://pluginprobe.com/plugins/code-snippets/3.10.0-beta.1/raw/js/components/common/icons/ViewIcons.tsx
- Modified: 2026-08-04T13:38:10+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/code-snippets/3.10.0-beta.1/code/js/components/common/icons/ViewIcons.tsx#L10-L20`.

```tsx
import React from 'react'
import type { SVGProps } from 'react'

export const CardViewIcon: React.FC<SVGProps<SVGSVGElement>> = props =>
	<svg
		width="18"
		height="18"
		viewBox="0 0 18 18"
		fill="none"
		xmlns="http://www.w3.org/2000/svg"
		{...props}
	>
		<rect x="2" y="2" width="5.5" height="5.5" rx="1" stroke="currentColor" strokeWidth="1.6" />
		<rect x="10.5" y="2" width="5.5" height="5.5" rx="1" stroke="currentColor" strokeWidth="1.6" />
		<rect x="2" y="10.5" width="5.5" height="5.5" rx="1" stroke="currentColor" strokeWidth="1.6" />
		<rect x="10.5" y="10.5" width="5.5" height="5.5" rx="1" stroke="currentColor" strokeWidth="1.6" />
	</svg>

export const TableViewIcon: React.FC<SVGProps<SVGSVGElement>> = props =>
	<svg
		width="18"
		height="18"
		viewBox="0 0 18 18"
		fill="none"
		xmlns="http://www.w3.org/2000/svg"
		{...props}
	>
		<path
			d="M2.5 4.5H15.5M2.5 9H15.5M2.5 13.5H15.5"
			stroke="currentColor"
			strokeWidth="1.8"
			strokeLinecap="round"
		/>
	</svg>

```