diff --git a/apps/docs/components/reference/CLICommandSection.tsx b/apps/docs/components/reference/CLICommandSection.tsx
index 473ad848907..a4b82892a7e 100644
--- a/apps/docs/components/reference/CLICommandSection.tsx
+++ b/apps/docs/components/reference/CLICommandSection.tsx
@@ -1,4 +1,5 @@
 // @ts-expect-error
+import { IconChevronRight } from '~/../../packages/ui'
 import spec from '~/../../spec/cli_v1_commands.yaml' assert { type: 'yml' }
 import CodeBlock from '~/components/CodeBlock/CodeBlock'
 import Options from '~/components/Options'
@@ -80,13 +81,19 @@ const CliCommandSection = (props) => {
                       )} */}
 
             {command.subcommands.length > 0 && (
-              <div className="">
-                <h3 className="text-sm text-scale-1200 mb-3">Available Commands</h3>
+              <div className="mb-3">
+                <h3 className="text-lg text-scale-1200 mb-3">Available Commands</h3>
                 <ul>
                   {command.subcommands.map((subcommand) => (
-                    <li key={subcommand}>
-                      <a href={`#${subcommand}`} className="text-scale-1200">
-                        <CodeBlock language="bash">{subcommand}</CodeBlock>
+                    <li key={subcommand} className="flex items-center gap-3">
+                      <div className="text-scale-900">
+                        <IconChevronRight size={14} strokeWidth={2} />
+                      </div>
+                      <a
+                        href={`#${subcommand}`}
+                        className="transition text-scale-1100 hover:text-brand-900"
+                      >
+                        $ {subcommand.replace(/-/g, ' ')}
                       </a>
                     </li>
                   ))}