diff --git a/src/CircleOcticon.js b/src/CircleOcticon.tsx
similarity index 66%
rename from src/CircleOcticon.js
rename to src/CircleOcticon.tsx
index 1e4fb0249b4..b6d017dd139 100644
--- a/src/CircleOcticon.js
+++ b/src/CircleOcticon.tsx
@@ -1,12 +1,19 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import Flex from './Flex'
+import Flex, {FlexProps} from './Flex'
 import theme from './theme'
 import BorderBox from './BorderBox'
+import {IconProps} from '@primer/octicons-react'
 
-function CircleOcticon(props) {
+export type CircleOcticonProps = {
+  as?: React.ElementType
+  size?: number
+  icon: React.ComponentType<{size?: IconProps['size']}>
+} & FlexProps
+
+function CircleOcticon(props: CircleOcticonProps) {
   const {size, as} = props
-  const {icon: IconComponent, bg, as: asProp, ...rest} = props
+  const {icon: IconComponent, bg, ...rest} = props
   return (
     <BorderBox as={as} bg={bg} overflow="hidden" borderWidth={0} size={size} borderRadius="50%">
       <Flex {...rest} alignItems="center" justifyContent="center">
diff --git a/src/__tests__/CircleOcticon.js b/src/__tests__/CircleOcticon.tsx
similarity index 100%
rename from src/__tests__/CircleOcticon.js
rename to src/__tests__/CircleOcticon.tsx
diff --git a/src/__tests__/__snapshots__/CircleOcticon.js.snap b/src/__tests__/__snapshots__/CircleOcticon.tsx.snap
similarity index 100%
rename from src/__tests__/__snapshots__/CircleOcticon.js.snap
rename to src/__tests__/__snapshots__/CircleOcticon.tsx.snap