Become a member
to unlock all features

Create egghead account to access 5000+ tutorials and resources from expert developers.

Create account

    Creating a Generic Text Input Component Using Styled System CSS

    In this lesson we’ll create a generic text input primitive component, that we could use to render headings of different levels in our app. We’ll use Styled System to create this component.

    We’re going to use Styled System’s CSS package to define styles using our design tokens — values from our theme file.

    We’ll use following libraries:

    You can either use this lesson’s Git repository or install them manually in your project:

    npm install styled-components styled-system @styled-system/css

    Useful links and documentation: