Download
RFS is a unit resizing engine which was initially developed to resize font sizes (hence its abbreviation for Responsive Font Sizes). Nowadays RFS is capable of rescaling basically every value for any CSS property with units, like margin, padding, border radius or even box-shadow. The mechanism automatically calculates the appropriate values based on the dimensions of the browser viewport. It's available in one of your favorite preprocessors or postprocessor, Sass, Less, Stylus or PostCSS. The source files can also be downloaded manually and used in a project. This method is not recommended because you lose the ability to easily and quickly manage and update RFS as a dependency. RFS works out of the box without any configuration tweaks. Enabling the two dimensional media queries will determine the value based on the smallest side of the screen with vmin. This prevents values from changing if the device toggles between portrait and landscape mode.
Features
- No need to rescale paddings or margins anymore
- Text won't be chopped off in smaller viewports when RFS is applied to font sizes
- RFS will prevent the font size from rescaling too small, so readability can be assured
- The font sizes of all text elements will always remain in relation with each other
- RFS can be installed using a package manager
- The source files can also be downloaded manually
Project Samples
