Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Using CSS in Framer X component
// Here is a basic Framer X component where we use CSS directly
import * as React from "react";
import { PropertyControls, ControlType } from "framer";
// Define type of property
interface Props {
width: number
height: number
}
const css = `
body {
margin: 0;
}
h4 {
font-size: 20px;
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.test {
background: red;
height: 100%;
display: flex;
}`;
export class test extends React.Component<Props> {
static defaultProps = {
width: 960,
height: 70,
}
render() {
return (
<div className="test">
<h4>I am a framer X component</h4>
<p>I am a framer X component</p>
<style>{css}</style>
</div>
)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.