Skip to main content

Documentation Index

Fetch the complete documentation index at: https://pactto.mintlify.app/llms.txt

Use this file to discover all available pages before exploring further.

You can define the colors and radius to match your branding. Simply change the design tokens to match your site’s design language.
index.html
<script>
    window.pactto = window.pactto || {};
    window.pactto.coach = 'username';
    window.pactto.company = 'Coach Name';
    // Add designTokens attribute:
    window.pactto.designTokens = {
        primary: '#D5B666',
        primaryTextColor: '#1A1A1A',
        primaryBackgroundColor: '#F4F2EC',
        textInputPrimaryColor: '#1A1A1A',
        textInputPrimaryBackgroundColor: '#E9E2CB',
        textInputPrimaryBorderColor: 'transparent',
        buttonPrimaryColor: '#232225',
        buttonPrimaryBorderRadius: '0',
        buttonPrimaryBackgroundColor: '#D5B666',
        buttonCancelBorderRadius: '0',
        buttonCancelBackgroundColor: '#B8B8B8',
    };
</script>
Below you can see what each design token represents: All design tokens:
index.html
<script>
    window.pactto = window.pactto || {};
    window.pactto.coach = 'username';
    window.pactto.company = 'Coach Name';
    // All designTokens attribute:
    window.pactto.designTokens = {
        primary: '#1dbaa5',
        primaryTextColor: '#ffffff',
        primaryTextFontFamily: 'Roboto, "Helvetica Neue", sans-serif',
        primaryTextFontSize: '1rem',
        primaryBackgroundColor: '#232225',
        h2FontFamily: '"museo-slab", serif',
        h2FontSize: '2.2rem',
        h2LineHeight: '2.8rem',
        h3FontFamily: '"museo-slab", serif',
        h3FontSize: '1.6rem',
        h3LineHeight: '2.2ch',
        textInputPrimaryColor: '#FFFFFF',
        textInputPrimaryFontFamily: 'Roboto, "Helvetica Neue", sans-serif',
        textInputPrimaryFontSize: '0.875rem',
        textInputPrimaryLineHeight: '1.125rem',
        textInputPrimaryBackgroundColor: '#2c2b2e',
        textInputPrimaryBorderColor: '#2c2b2e',
        textInputPrimaryBorderWidth: '1px',
        textInputPrimaryBorderRadius: '0',
        buttonPrimaryColor: '#232225',
        buttonPrimaryBorderColor: 'transparent',
        buttonPrimaryBorderRadius: '3.75rem',
        buttonPrimaryBorderWidth: '0',
        buttonPrimaryBackgroundColor: '#1dbaa5',
        buttonPrimaryFontSize: '1rem',
        buttonPrimaryLineHeight: '1rem',
        buttonPrimaryPaddingTop: '1.9ch',
        buttonPrimaryPaddingBottom: '1.8ch',
        buttonCancelColor: '#232225',
        buttonCancelBorderColor: 'transparent',
        buttonCancelBorderRadius: '3.75rem',
        buttonCancelBorderWidth: '0',
        buttonCancelBackgroundColor: '#9b9b9b',
        buttonCancelFontSize: '1rem',
        buttonCancelLineHeight: '1rem',
        buttonCancelPaddingTop: '1.9ch',
        buttonCancelPaddingBottom: '1.8ch',
    };
</script>