How

Just create a interface and add the type with the property read only. After, add the interface to the tag declaration with < >:

interface Props {
  readonly color: string
}
 
const Text = styled.h1<Props>`
  color: ${(props) => props.color};
`
 
const Component = () => <Text color='white'>Title</Text>
 
export default Component
interface Props {
  readonly color: string
}
 
const Text = styled.h1<Props>`
  color: ${(props) => props.color};
`
 
const Component = () => <Text color='white'>Title</Text>
 
export default Component

referencies

Using custom props: https://styled-components.com/docs/api#using-custom-props [archive ]