Para aplicar estilos CSS en línea a un componente en React usamos la prop style
. La diferencia de cómo lo haríamos con HTML, es que en React los estilos se pasan como un objeto y no como una cadena de texto (esto puede verse más claro con los dobles corchetes, los primeros para indicar que es una expresión JavaScript, y los segundos para crear el objeto):
function Button({ text }) {
return (
<button style={{ color: 'red', borderRadius: '2px' }}>
{text}
</button>
)
}
Fíjate que, además, los nombres de las propiedades CSS están en camelCase.