Skip to content

Instantly share code, notes, and snippets.



Created Feb 16, 2018
What would you like to do?
preact-fela basic usage
import {h} from 'preact'
import {style} from 'preact-fela-simple'
const Header = ({title, styles}) =>
<header className={styles.container}>
<h1 className={styles.title}>{title}</h1>
const styles = ({theme, size}) => ({
container: {
textAlign: 'center',
padding: '20px',
height: '200px'
title: {
lineHeight: 1.2,
fontSize: size,
color: theme.colors.primary
export default style(styles)(Header)
import Preact, {h} from 'preact'
import {createRenderer} from 'fela'
import {Provider} from 'preact-fela-simple'
import Header from './header'
const renderer = createRenderer()
const theme = {
colors: {
primary: 'red'
<Provider renderer={renderer} theme={theme}>
<Header title="Hello world" size="17px" />
), document.getElementById('root'))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment