8

I would like to use custom font in fabric text object, I followed the link below: http://fabricjs.com/fabric-intro-part-4/

But it seems that it's only supported in node.js.

Is there any way to support it on simple fabric text object on canvas?

jdrake
  • 333
  • 4
  • 17
user2624969
  • 81
  • 1
  • 2
  • 1
    Include custom font in a document, using CSS, just like you would do to render it in HTML. Then specify font family for `fabric.Text` instance. – kangax Jul 30 '13 at 14:13
  • HI @kangax.. i working in Curved text using fabric.js how can i used font family for curve text....? any predefined property for font family? – VIVEK-MDU Mar 11 '14 at 15:07

2 Answers2

14

Use CSS:

@font-face
{
font-family: myFirstFont;
src: url('Sansation_Light.ttf'),
url('Sansation_Light.eot'); /* IE9 */
}

Create fabric text object instance :

 var object = new fabric.Text("NEW TEXT", { 
    fontFamily: "myFirstFont", 
    left: 150,
    top: 100,
    fontSize: 24,
    textAlign: "left",
    fill: "#000000"
});
canvas.add(object);
canvas.renderAll();
John
  • 2,003
  • 2
  • 20
  • 30
0

By using Simple Css property Font @Face