Project Details
Changes Log
Who We Are

JavaFX CSS properties types

    1  Fonts
       1.1  Example
    2  General properties
       2.1  Sizes
          2.1.1  Example
       2.2  Dash patterns
          2.2.1  Example
       2.3  Haloing
          2.3.1  Example
       2.4  Padding
          2.4.1  Example
    3  Notes

This article explains a few useful CSS proerties type for the JavaFX CSS configuration.


The following CSS elements can be define for a font: Note that fonts used in the CSS configuration are defined by their font family. Therefore if you want to use a font which is not installed on the platform in the CSS configuation file, you will have to define it in the Graphics configuration to perform the binding[1]


      −fx−font−family: 'MyFontFamily';
      −fx−font−size: 14.4;

General properties


The Pattern for sizes can be one of the following:


      −fx−stroke−width: 12mm;

Dash patterns

The dash Patterns can define a series of visible and invisible segments. The Pattern is: <size> [<size>]+. Every element of the Pattern define the size of one visible and invisible segment. On the case of only one value, each segment will have the same size.


      −fx−dash−array: 2mm 1mm;


Haloing around a Shape can be defined with the −fx−effect property, with an associated dropShadow:

      −fx−effect : dropshadow(<type>, <color>, <radius>, <spread>, <offsetX>, <offsetY>)

The meaning of the arguments is:


      −fx−effect: dropshadow(gaussian, black, 0.3, 1.0, 0, 0);


The padding of a widget define the spacing between the widget (usually a text) and its bouding box. The format is: <size> <size> <size> <size>. The order of the elements is: top, right, bottom, left. If only one size is defined, all sizes will be identical.
The following diagram present a top left padding:


      −fx−effect: −fx−padding: 2mm 2mm 1mm 1mm;


  1. See resolving fonts used in the Look and Feel
  2. gaussian seems to have the best results
  3. Normally you would want to use "black" for the color
  4. For the value 0, all the halo will be blurred (on all the radius). For the value 1, all the halo will be sharp (on all the radius)
  5. Choose 0 for a better result

See Also

Category: lookandfeel Category: server Category: jfx Category: user

Copyright 2016 Dassault Aviation. All Rights Reserved. Documentation and source under the GPL v2 licence

Project Web Hosted by SourceForge.net Copyright 1999-2010 - Geeknet, Inc., All Rights Reserved About - Legal - Help