Skip to content

Instantly share code, notes, and snippets.

@davo
Created May 21, 2019 21:38
Show Gist options
  • Save davo/f28362a8b6659824afeaa1acc5c1b7cb to your computer and use it in GitHub Desktop.
Save davo/f28362a8b6659824afeaa1acc5c1b7cb to your computer and use it in GitHub Desktop.
Reusing Framer X Shared Colors on a Function Component
import * as React from 'react'
import { Stack, Frame } from 'framer'
import { colors } from './canvas'
export function Colors() {
const [colorsTokens] = React.useState(() => {
return Object.keys(colors).map(key => colors[key])
})
return (
<Stack size={'100%'}>
{colorsTokens.map((color, index) => {
return <Frame key={index} size={24} background={color} />
})}
</Stack>
)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment