Fuel Calculator – Widget for websites

This javascript widget can be embedded to your website for free. Also there is paid version with some advantages.

Plans

Free	Start	Pro (for websites with subdomains)
No ads	No ads	No ads
CSS support	CSS support	CSS support
7calc.net label	No 7calc.net label	No 7calc.net label
No additional options	Additional options	Additional options
Unlimited domains	Single domain	Single domain
Unlimited subdomains	No subdomains	Unlimited subdomains
Only for public pages	For public and private pages	For public and private pages
Free
Get code

Demo

Find fuel amount and cost

Find average consumption

Vehicle fuel efficiency

Distance

miles

Price per gallon

Styling

Since widget is being stored into html directly (without iframe), CSS styles also can be applied directly to widget elements. All user-defined css properties should include !important.

Below is the CSS-code with several common examples of widget stylization.

This code (or your own CSS rules) can be added to your project's CSS file or inline using <style> tag.


        /* Calculator background color */

        .calc-form {

            background-color: #f7f7f7 !important;

        }
        


        /* Footer background color (if you want footer background to vary from main background) */

        .calc-footer {

            background-color: #eeeeee !important;

        }
        


        /* Border */

        .calc-form {

            border: 1px solid #eee !important;

        }
        


        /* Links color */

        .calc-form a {

            color: #336600 !important;

        }
        


        /* Button color */

        :root {

            --submit-background: mediumseagreen !important;

            --submit-background-hover: mediumseagreen !important;

        }

It is prohibited to make invisible or pale, descrease size or move the 7calc.net label. These changes will be treated as violation of widget usage rules, which will cause the domain ban.

FAQ

Do you provide calculator source code if I buy widget?
No. Widget is only a javascript code that you place on your website.

Disclaimer

Installing widget on your website you agree that 7calc.net website as widget provider is not responsible for incorrect widget display, for information in widget, for possible errors in calculations.

We also keep the right to modify widget HTML code, what may cause applied styles no longer work correctly.

Fuel Calculator – Widget for websites

Plans

Demo

Styling

FAQ

Disclaimer

Widget code

Widget options

Menu