Future-tint NPM

Logo

FutureTint is a utility-first CSS library that provides custom classes for styling. It is designed to work seamlessly with React applications and gives you the flexibility to build responsive layouts with minimal effort. .

Installation
For HTML CDN
Available Classes
Search for Classes
Responsive Sizes
How to Use

Installation

You can install this package via npm:

npm install future-tint

For HTML CDN

You can include the CSS file in your HTML file using the following CDN link:

https://cdn.jsdelivr.net/npm/future-tint@latest/dist/common.min.css

Search Classes

For search available futuretint classes by enter style name example you need margin related classes enter simply margin https://futuretint.futureapps.in/

Responsive Sizes

Devices	Pixles	Description
vs	<427px	Very small devices
xs	<567px	Extra small devices
sm	<768px	Small devices
md	<867px	Medium devices
lg	<1024px	Large devices
xl	<1225px	Extra large devices
xxl	<1440px	Very extra large devices
<!--	-----------------	-------------	-----
vs	<375px	Very small devices
xs	<427px	Extra small devices
sm	<567px	Small devices
md	<768px	Medium devices
mmd	<867px	Medium Middle devices
lg	<1024px	Large devices
xl	<1225px	Extra large devices
xxl	<1440px	Very extra large devices
xxxl	<2560px	4k large devices	-->

Usage

import React from 'react';
import 'future-tint/dist/common.min.css';

<div class="px-10px px-10px--sm h-50px fs-22px rd-20px rd-tl-15px">
  Your Content Here.
</div>

in this use px means padding-left and right, h-50pxmeans height is 50px, rd-20px = borader radius is 20px and rd-tl-20px means border-top-left-radius 15px

this FutureTint is help to build your web fast by using our classes with responsive