This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Jitendra Vyas
Posted Feb 09 - Read on Facebook

Can we also make graphics (like things we ca create with html and css only) with Framer or whenever we need a grphic it should be imported from Photoshop or sketch?

8 Comments

Joshua Tucker

Hey Jitendra Vyas! Does either of these help you for what you are looking to do?

Framer has a layer.html method. You can insert HTML into a layer you create in Framer. The documentation for it is here: http://framerjs.com/docs/#layer.html

You can also use CSS style properties. Documentation is available here: http://framerjs.com/docs/#layer.style

Marcelo Eduardo Oliveira

Jitendra Vyas : Think of Framer as a layer HTML component that you have full control. So you can (inside the layer) add whatever you could in normal html: a SVG pie chart, a Canvas element that has it's own chart drawing, or even like you mentioned, draw anything in css as child layers of your main layer.

On the other hand: If you can import from Sketch / photoshop and that saves you time, you should probably do it.

Marcelo Eduardo Oliveira

Ops Joshua, sorry for the duplicate. I think we were writing at the exact same moment!

Jitendra Vyas

Thanks Joshua and Marcelo for quick replies. This community is very supportive.

Joshua Tucker

Marcelo Eduardo Oliveira Your comment is not void by any means. Thanks for your input and insight!

Joshua Tucker

Jitendra Vyas For sure man! Hopefully this gets you kickstarted. Keep us posted if you can, we'd love to see what you do!

Jitendra Vyas

I was just exploring what I can do with Framer without purchasing Photoshop and Sketch and Framer studio

Joshua Tucker

Jitendra Vyas This might come in handy for you then:

layer.image: You can add an image as one of a layer's properties. http://framerjs.com/docs/#layer.image

If you haven't stumbled upon the Docs yet, they are super awesome. Great resource. If you are using Framer Studio, there's a Docs button in the top left hand corner of the window (above the code editor).

http://framerjs.com/docs

Read the entire post on Facebook