Skip to main content

Styled Components

You can use styled api to create a Fower component, then you can use atomic props with the component.

info

styled can be used in all React-like frameworks, such as React, React-native, Preact, etc.

Import

import { styled } from '@fower/react'

Styling html element

The element wrapped by styled can use atomic props to change the style of the component.

Result
Loading...
Live Editor

Styling any Component

styled can style any component as long as it accepts a className prop.

Result
Loading...
Live Editor

With initial atomic props

In order to better reuse styles, when using styled to create a component, we can initialize some styles for the component.

Result
Loading...
Live Editor

Initial with object style

Result
Loading...
Live Editor

Both

Result
Loading...
Live Editor