diff --git a/src/components/Icon.tsx b/src/components/Icon.tsx
index 71499e5..eaaf357 100644
--- a/src/components/Icon.tsx
+++ b/src/components/Icon.tsx
@@ -120,10 +120,12 @@ function getSVGIconComponent(
 type Props = {
   type: string
   className?: string
+  placeholder?: boolean
   onClick?: (event: React.MouseEvent<HTMLElement>) => void
 }
 
-export function Icon({ type, className = undefined, ...otherProps }: Props) {
+export function Icon({ type, className = undefined, placeholder, ...otherProps }: Props) {
+  if (placeholder) return <div className={cx('octicon-wrapper')} />
   const { name, IconComponent } = getSVGIconComponent(type)
   const mergedClassName = cx('octicon', name)
   return (
@@ -131,6 +133,7 @@ export function Icon({ type, className = undefined, ...otherProps }: Props) {
       {React.createElement(Octicon, {
         icon: IconComponent,
         className: mergedClassName,
+        verticalAlign: 'middle',
       })}
     </div>
   )
diff --git a/src/components/Node.tsx b/src/components/Node.tsx
index f978e1b..d429ddf 100644
--- a/src/components/Node.tsx
+++ b/src/components/Node.tsx
@@ -78,8 +78,8 @@ const NodeItemIcon = React.memo(function NodeItemIcon({
   )
   return (
     <>
-      {node.type !== 'blob' && <Icon type={getIconType(node)} />}
-      <img alt={node.name} className={'node-item-icon'} src={src} />
+      <Icon placeholder={node.type === 'blob'} type={getIconType(node)} />
+      {node.type !== 'commit' && <img alt={node.name} className={'node-item-icon'} src={src} />}
     </>
   )
 })
diff --git a/src/content.less b/src/content.less
index ec998e8..6e34e52 100644
--- a/src/content.less
+++ b/src/content.less
@@ -363,7 +363,7 @@
               height: 16px;
               object-fit: contain;
               vertical-align: middle;
-              padding-left: 6px;
+              padding-left: 4px;
               box-sizing: content-box;
 
               &.dim {