Theming

You can harness the power of our theme for cart interface customization. This is a simple and effective way of changing with confidence some frequently customized part of Snipcart's interface.

How this works

We now use a set of CSS custom properties (variables) throughout our app's style. These variables all have a default value which is used as a fallback (default theme) if you haven't declared it in your own styles.

Ex: color: var(--color-link, blue); will be blue if no --color-link is declared.

Colors

This is one of the most frequently customized part of our application. Our theme offers a complete set of color variables to change the entire color scheme of the app. As you will see below, more control is given for key components of the application like inputs, buttons and links.

Example (Dark theme)

Here is an example of color theme customization for a dark version of our app. It uses all currently available variables.

#snipcart {
    /* ----------------- 
        Colors
    ----------------- */
    --color-default: hsl(0, 0%, 90%);
    --color-alt: hsl(0, 0%, 50%);
    --color-icon: hsl(200, 90%, 40%);
    --color-success: hsl(144, 50%, 55%);
    --color-error: hsl(6, 55%, 60%);

    --color-link: hsl(220, 70%, 55%);
    --color-link-hover: hsl(220, 70%, 65%);
    --color-link-active: var(--color-link);
    --color-link-focus: var(--color-link);

    --color-input: var(--color-default);
    --color-input-hover: var(--color-input);
    --color-input-focus: var(--color-input);
    --color-input-checked: var(--color-input);
    --color-input-disabled: var(--color-alt);
    --color-input-error: var(--color-error);
    --color-inputLabel: var(--color-default);
    --color-inputLabel-hover: var(--color-inputLabel);
    --color-inputLabel-focus: var(--color-inputLabel);
    --color-inputIcon: var(--color-alt);
    --color-inputIcon-hover: var(--color-default);
    --color-inputIcon-focus: var(--color-inputIcon);
    --color-inputIcon-checked: var(--color-default);
    --color-inputIcon-success: var(--color-success);
    --color-inputIcon-error: var(--color-error);
    --color-inputPlaceholder: var(--color-alt);

    --color-buttonPrimary: var(--color-default);
    --color-buttonPrimary-hover: hsl(0, 0%, 100%);
    --color-buttonPrimary-active: var(--color-buttonPrimary);
    --color-buttonPrimary-focus: var(--color-buttonPrimary);
    --color-buttonPrimary-disabled: var(--color-alt);
    --color-buttonPrimary-success: var(--color-buttonPrimary);
    --color-buttonPrimary-error: var(--color-buttonPrimary);

    --color-buttonSecondary: var(--color-icon);
    --color-buttonSecondary-hover: hsl(200, 90%, 50%);
    --color-buttonSecondary-active: var(--color-buttonSecondary);
    --color-buttonSecondary-focus: var(--color-buttonSecondary);
    --color-buttonSecondary-disabled: hsl(210, 10%, 25%);
    --color-buttonSecondary-success: var(--color-success);
    --color-buttonSecondary-error: var(--color-error);

    --color-buttonDanger: var(--color-error);
    --color-buttonDanger-hover: hsl(6, 55%, 70%);
    --color-buttonDanger-active: var(--color-buttonDanger);
    --color-buttonDanger-focus: var(--color-buttonDanger);
    --color-buttonDanger-disabled: hsl(210, 10%, 25%);
    --color-buttonDanger-success: var(--color-default);
    --color-buttonDanger-error: var(--color-default);

    --color-badge: var(--color-link);
    --color-badge-active: var(--color-link);
    --color-badge-disabled: var(--color-alt);

    /* ----------------- 
        Border colors
    ----------------- */
    --borderColor-default: hsla(0, 0%, 100%, 10%);
    --borderColor-error: hsl(6, 55%, 30%);

    --borderColor-link: currentColor;
    --borderColor-link-hover: currentColor;
    --borderColor-link-active: currentColor;
    --borderColor-link-focus: currentColor;

    --borderColor-input: hsla(0, 0%, 100%, 10%);
    --borderColor-input-hover: hsl(200, 90%, 40%);
    --borderColor-input-focus: var(--borderColor-input-hover);
    --borderColor-input-checked: var(--borderColor-input-hover);
    --borderColor-input-disabled: hsl(210, 10%, 20%);
    --borderColor-input-error: var(--borderColor-error);

    --borderColor-buttonPrimary: transparent;
    --borderColor-buttonPrimary-hover: transparent;
    --borderColor-buttonPrimary-focus: transparent;
    --borderColor-buttonPrimary-disabled: transparent;
    --borderColor-buttonPrimary-success: transparent;
    --borderColor-buttonPrimary-error: transparent;

    --borderColor-buttonSecondary: transparent;
    --borderColor-buttonSecondary-hover: transparent;
    --borderColor-buttonSecondary-focus: transparent;
    --borderColor-buttonSecondary-disabled: transparent;
    --borderColor-buttonSecondary-success: transparent;
    --borderColor-buttonSecondary-error: transparent;

    --borderColor-badge: transparent;
    --borderColor-badge-active: transparent;
    --borderColor-badge-disabled: transparent;

    /* ----------------- 
        Background colors
    ----------------- */
    --bgColor-default: hsl(210, 10%, 11%);
    --bgColor-alt: hsl(210, 10%, 9%);
    --bgColor-success: hsl(144, 70%, 15%);
    --bgColor-error: hsl(6, 50%, 15%);
    --bgColor-info: hsl(210, 55%, 15%);

    --bgColor-modal: hsl(210, 10%, 7%);
    --bgColor-modalVeil: hsla(210, 10%, 7%, .75);

    --bgColor-link: none;
    --bgColor-link-hover: none;
    --bgColor-link-active: none;
    --bgColor-link-focus: hsl(210, 55%, 10%);

    --bgColor-input: hsl(210, 10%, 10%);
    --bgColor-input-hover: var(--bgColor-input);
    --bgColor-input-focus: var(--bgColor-input);
    --bgColor-input-checked: var(--borderColor-input-hover);
    --bgColor-input-disabled: hsl(210, 10%, 14%);
    --bgColor-input-error: var(--bgColor-input);
    --bgColor-input-autofill: hsl(210, 60%, 15%);

    --bgColor-buttonPrimary: hsl(220, 70%, 22%);
    --bgColor-buttonPrimary-hover: hsl(220, 70%, 30%);
    --bgColor-buttonPrimary-active: var(--bgColor-buttonPrimary);
    --bgColor-buttonPrimary-focus: var(--bgColor-buttonPrimary);
    --bgColor-buttonPrimary-disabled: hsl(210, 10%, 25%);
    --bgColor-buttonPrimary-success: hsl(144, 66%, 30%);
    --bgColor-buttonPrimary-error: hsl(6, 60%, 35%);

    --bgColor-buttonSecondary: var(--bgColor-info);
    --bgColor-buttonSecondary-hover: hsl(210, 60%, 18%);
    --bgColor-buttonSecondary-active: var(--bgColor-buttonSecondary);
    --bgColor-buttonSecondary-focus: var(--bgColor-buttonSecondary);
    --bgColor-buttonSecondary-disabled: hsl(210, 10%, 9%);
    --bgColor-buttonSecondary-success: var(--bgColor-success);
    --bgColor-buttonSecondary-error: var(--bgColor-error);

    --bgColor-buttonDanger: var(--bgColor-error);
    --bgColor-buttonDanger-hover: hsl(6, 50%, 18%);
    --bgColor-buttonDanger-active: var(--bgColor-buttonDanger);
    --bgColor-buttonDanger-focus: var(--bgColor-buttonDanger);
    --bgColor-buttonDanger-disabled: hsl(210, 10%, 9%);
    --bgColor-buttonDanger-success: hsl(144, 66%, 30%);
    --bgColor-buttonDanger-error: hsl(6, 60%, 35%);

    --bgColor-badge: hsl(210, 55%, 10%);
    --bgColor-badge-active: hsl(210, 60%, 15%);
    --bgColor-badge-disabled: hsl(210, 10%, 11%);

    /* ----------------- 
        Shadows
    ----------------- */

    --shadow-default: 0px 20px 24px -20px hsla(0, 0%, 0%, .5);
    --shadow-tooltip: 0px 8px 16px hsla(220, 70%, 22%, .5);

    --shadow-link-focus: 0px 6px 4px -3px hsla(200, 90%, 40%, .5);

    --shadow-input-hover: none;
    --shadow-input-focus: 0px 5px 10px -3px hsla(200, 90%, 40%, .3);
    --shadow-input-checked: none;

    --shadow-buttonPrimary-hover: 0px 10px 4px -8px hsla(0, 0%, 0%, .5);
    --shadow-buttonPrimary-active: none;
    --shadow-buttonPrimary-focus: 0px 0px 6px 2px hsl(200, 90%, 40%);

    --shadow-buttonSecondary-hover: 0px 10px 4px -8px hsla(0, 0%, 0%, .2);
    --shadow-buttonSecondary-active: none;
    --shadow-buttonSecondary-focus: 0px 0px 6px 2px hsla(200, 90%, 40%, .8);

    --shadow-buttonDanger-hover: 0px 10px 4px -8px hsla(0, 0%, 0%, .25);
    --shadow-buttonDanger-active: none;
    --shadow-buttonDanger-focus: 0px 0px 6px 2px hsla(6, 55%, 60%);
}

What's next

Colors were our priority for the theme. We look forward to add more types of customization into our theme based on your feedback.

Browser support

CSS variables are supported by all major browsers. Our implementation falls back to our default theme when CSS variables are not supported. Users on legacy browsers will still be able to enjoy the default experience.

nce/refunds","ab5da383-ac04-45a7-86fa-2d723332bf5e","1183b303-0bda-4bd3-ba3b-c1a28774b248","Customization","/api-reference/notifications","7122087a-ff6f-4389-a335-c526cfdde0ad","Order validation","6a2f216e-64c2-4810-8166-8cb3f9814387","/testing/going-live","Going live","c19a72ae-5c37-450a-9d65-6b7ac6b49122","Testing","/email-templates/basics","a94e3432-447a-4db2-aa66-b64a1c91e816","/email-templates/custom-helpers","Custom helpers","f342c3e7-f188-4908-8a2e-f49a37e6b327","/email-templates/invoices","Invoices","2b58591f-274d-4633-bbeb-156ebcf45533","/email-templates/tracking-numbers","/webhooks/taxes","16762f3b-6412-4881-ad43-37e310b5a587","/email-templates/order-shipped","Order shipped","b7544d4c-762f-457b-8006-d0ee96f492e6","Customer dashboard","/webhooks/shipping","391355fb-8338-43da-9462-e240dd0b3435","Subscription events","/email-templates/order-comments","Order comments","984dc54c-f278-4d13-b3a4-25482daa7649","/email-templates/forgot-password","Forgot password","a611af11-b6f4-44f0-aa4a-8ef142afd6a5","34d19fd4-b2a2-4e0a-813b-0fdcb58c342b","Orders","Events","/api-reference/orders","a7cbcbe4-c51a-4cab-bacd-3c74be11f5dd","Errors","/api-reference/introduction","/setup/discounts","bef46971-f706-4a6b-b9ff-7f081683531a","/api-reference/authentication","Authentication","fa3ab1fb-cc6c-42fa-afa0-f793017056ff","/api-reference/errors","26c6c760-afe7-4e7b-99ea-35bcea573ecb","/tutorials","/webhooks/subscription-events","/javascript-api/events","/javascript-api/configuration","fd0fcc7a-8c26-4d36-ad63-eb3d66fbafc8","Payments","/testing/payments","d6c3c5a0-b539-4c31-9d87-3214d28e9a2b","Test configurations","/testing/test-configurations","Environment","Account configurations","Store configurations","Manage store","General navigation","ad916705-b3b9-4a99-a790-4e98a045395b","Upgrade version","/configuration/upgrade-version","Debugging","/configuration/debugging","a5afe2c4-05fb-4178-8085-7abac24cc7db","Checkout as guests","/configuration/checkout-as-guest","Configuring PayPal","2812a441-3c1c-4b50-b6f9-c69ebbe8a8a9","JSON Crawler","/configuration/json-crawler","ddf7d726-dc4f-4b43-a4bc-9c49819e71a9","/configuration/localization","b1e7bc3d-99fd-449a-ab9b-8efbe8d5c633","bacf339a-603c-4f88-a66d-8fcd3fbce00a","Shipping providers","API Reference","/configuration/shipping-providers","/configuration/multi-currency","Custom fields","/configuration/custom-fields","00c8e043-a3f7-40e5-96df-719df51e57e8","/javascript-api/public-api","aee4dd92-711c-4254-95b2-ed2e3012cc96","f6be5910-e645-4648-b8bf-70f2478fdf69","Recurring and subscription plans definition","/configuration/recurring-and-subscriptions","c9af405c-e540-43b3-8076-030a293a337c","Product definition","/configuration/product-definition","/getting-started/customization","Public API","Guides and tutorials","/javascript-api/localization","/troubleshooting/order-validation","/getting-started/customer-dashboard","fbdfe3e2-2ae3-4976-9e43-adb9c7d9fea0","Troubleshooting","The cart","/security","9e4782eb-3c52-456c-af0d-dc2729267b71","Produits","Livraison","Rabais","Navigation","/getting-started/the-cart","Tracking numbers","Paniers abandonnés","/email-templates/digital-download","Digital download","be53d4ba-968e-4911-92ee-f7295ab65226","/email-templates/subscription-canceled","Subscription canceled","70485b49-69d5-479c-9644-55335f0dd7a1","/email-templates/order-received","Order received","1599d061-7b7c-425f-8700-7b884ad1d010","/email-templates/payment-expired","Payment expired","554492ed-9261-4fa1-adb4-a2f3fe4b1511","/modeles-de-courriels/paniers-abandonnes","/reference-api/clients","/modeles-de-courriels/les-bases","/webhooks/livraison","/configuration/rabais","/reference-api/rabais","/webhooks/calcul-des-taxes","/tutoriels","/reference-api/authentification","/tableau-de-bord/environnements","/webhooks/exemples","/reference-api/sessions-utilisateur","/modeles-de-courriels/aides-personnalisees","/tableau-de-bord/navigation","/reference-api/erreurs","/reference-api/produits","/modeles-de-courriels/commentaires-sur-les-commandes","/tableau-de-bord/configuration-de-la-boutique","/reference-api/paniers-abandonnes","/configuration/taxes","/setup/theming","Theming","6d1e764f-5ba8-4b91-a78e-51c269662f01","/reference-api/commandes","/modeles-de-courriels/factures","Configuration de la boutique","/reference-api/domaines","/modeles-de-courriels/mot-de-passe-oublie","/tableau-de-bord/centre-de-notification","/reference-api/methodes-de-livraison-personnalisees","/tableau-de-bord/configuration-de-paypal","/modeles-de-courriels/numeros-de-suivi","/reference-api/notifications","/webhooks/les-bases","/test/passer-en-production","/tableau-de-bord/configuration-du-compte","/tableau-de-bord/gestion-de-la-boutique","/webhooks/evenements-de-commande","/reference-api/remboursements","/modeles-de-courriels/commande-expediee","/test/environnement","/reference-api/introduction","9c5586ff-5b64-4c09-92cc-79ea1e97a01f","9f26d678-b4d6-4a2f-ba41-32eef8e030b3","1d5cf7d6565c","df9b9b5254ed","09f21d2739a8","8f87cc8e5b02","bf03f500-f710-4cdd-b1bb-33fa918aef1c","6a7735404c6f","0590ce14a69b","0f4ea252-4788-4e46-ab25-fdce66819b90","db553a8396c1","f031a276-afe2-4630-b7a2-425d4ff11de2","f571ebf33528","3bb68ec11bc3","400c810243f9","1d465679-4fec-4234-905f-e219b06f629b","006fe3d8e3b4","be29c0cfdac2","e116360c6f3b","5f915674cde5","93077c72-4690-468c-9937-a5c1ce07ad6a","JavaScript API","16292a217db6","36078166ab75","690fc0f39a2c","31fa06e5fad7","1dd0e789-b055-4c98-b578-1a1871842d01","6cefaddca699","6cf508a2d7df","38c6f0439e31","58e597984567","c87865b8af2c","0ab2fca37345","20d61cd2d509","23a8d379b670","d28cbbcee6c3","5124a03d741c","54cdfbea-f4d2-4b0f-8f11-d9e3f3d8ef49","6d83921ceb36","073d5f1ed74d","f2873abe9885","b004d45019b2","b39984893bf6","0db168fe0652","71f564cf89f5","ae8ac6e7036d","fd89064caff0","6e09d740-eb0f-47cd-87b3-8f33e6eed0e3","cd9c11c1f196","ae7b208666b6","a1e2286b96f9","923de59ba510","332e1b9c-4c9d-4c23-a76c-7355805fcd35","Principes de base","514aff91-817d-4316-b259-91cc8842b346","624b69271ca4","0f5b97c3ce1e","Sécurité","92b8ed3a885a","/securite","9fef61d29298","/migration-guide","Migration","Guide de migration","f91c0065-9f5c-44b0-b8e5-aaaa8fd0762d","4ec02b6ed4a3","/setup/installation",Array(3),"aa893ef52c95","/setup/products","0962a329af0d","5de76cd9-8011-4a24-a0a3-0794ef757044","f2e69f42997e","/subscriptions","Abonnements et paiements récurrents","8ad39507-40c4-486a-bb19-bfb159ec52d3","7d88a560a7e6","/setup/cart-summary","Cart summary","Résumé du panier","93bca7db-e0fc-46fb-9d31-dbf9f13669e2","e0d2222bb47f","/setup/customer-dashboard","Tableau de bord client","48372e18-7b2f-4190-8b00-d36be4d6ab31","80d116177684","/setup/customization","Personnalisation","673d1731-e025-4eee-9a12-4cbfaee44585","af86a838edbd","99c7c4c9-2804-4258-b4c7-44bba77b3de7","5d28604be12d","Thématisation","b1373902a1ab","/configuration/thematisation","8121bf122978","/setup/localization","Localisation","a9e9c353-9aaf-4bbc-a620-a6871d61f801","4f640bd11402","/setup/multi-currency","Multidevise","fcd6becc-196d-48c3-9670-23f3f91b5665","0a5986e24d2c","/setup/order-validation","Validation des commandes","b24e6d3f-4b77-4170-9beb-21308f9d5fdc","493f7ae3b3c6","/setup/order-custom-fields","Order custom fields","Champs personnalisés de commande","7396ad06-d326-49b0-be47-c416d275063a","2d1105ca2839","/setup/shipping","bd31195930cf","07a93acd-a812-46d7-b851-49b52edffe2a","a532d8e5f55d","3d54b8c093ec","72ec9d1e-72f0-40b6-a709-3f50d24106e1","260d7541690d","Store set up","9730c8c591b3","ecea59434eac","06dc0fd5-e1c9-45ba-8701-1e9b90108c9c","d1f910a263f7","Store management","Gestion de la boutique","028705987a49","Store configuration","93c537083f97","Account configuration","Configuration du compte","d33e3d7821d1","Environnements de test/production","5584ce657578","Centre de notification","72ce38f51010","PayPal configuration","Configuration de PayPal","f04b842ede4e","dc7e41954fab","bc00b9c389e3","Aides personnalisées","0d505c718b65","Factures","c5c5b5071c47","c940385c4301","Numéros de suivi","d84268e29a5c","Commande expédiée","afbdba49c329","db460da7c578","6416e57e4da7","Commentaires sur les commandes","4f3a0532f483","Mot de passe oublié","b0282fce20b7","6b76838c-56c4-48da-b5f9-6532189d8bb4","1715da99d26b","Téléchargement numérique","a8ca32249d6f","/modeles-de-courriels/telechargement-numerique","4efa7f513d49","88afd24859f6","8631dce8ae67","Abonnement annulé","fbb4fae35fd4","/modeles-de-courriels/abonnement-annule","0ef0785a28b4","8bef099e895e","/getting-started/security","Commande reçue","/v3/setup/theming","/modeles-de-courriels/commande-recue","ebf18d541601","c119fa4ac3b3","e04b4d1d020d","Paiement expiré","08881b6221bc","/modeles-de-courriels/paiement-expire","214c281fa06a","Environments","Environnement de test","c6aa2e3c98d2","Passer en production","07ed4fc79319","/sdk/basics","c9d7549b-e76a-4cf5-ac19-3b30d0546fec","9236b78a583d","/sdk/api","93c5fd14dc2a","68402140-9983-4c48-a2f8-830ee69d7714","45f61a4c79fa","/sdk/events","Événements","ed4e787c-ce0d-4f3d-8c74-77d9447ac74c","611bf27af5b9","/sdk/store","Storage","e2a01064-946e-46a5-ae7e-346b3fd40804","55fee6aea1d5","/sdk/reference","SDK reference","Références","ecedaa7f-dabb-478b-a993-b1ce2d39dfb3","JavaScript SDK","f7052c47b89e","8e6026c77029","Authentification","99ab9f71770f","Erreurs","c6142a0c726a","Commandes","34a34f57e7b9","Abonnements","f82fafc64f64","fff64f7424b5","Remboursements","b3cf1334eac9","Clients","6b7171634d0b","5a04d2c9899a","Sessions utilisateur","83b32a090ca5","ecfa221e4ac2","329c8f096272","Domaines","10d89b49262b","Méthodes de livraison personnalisées","API reference","0c4bcf2adb14","b0e5b196ce56","Événements de commande","56ff41e20280","/webhooks/subscription-event","Événements d'abonnement","40a530dd-3f7b-4ee5-ae03-7a3086880611","8aa7b1f20ec8","S6Y6JwHzZ4PJliAV42CRh6","4e4ff387741f","df4220ff1446","Exemples","94c7836ce5f3","/custom-payment-gateway","77889630-cd22-4ad6-b352-54040033c724","6027ba2be58f","/custom-payment-gateway/merchant-configuration","Merchant configuration","Configuration du commerçant","3ba3026b-2bfb-40b8-b0e3-b1a29eb5d8cd","9214ffdcbab4","/custom-payment-gateway/api","e6809589-d283-4b10-9e5c-a8ec15303cfb","8046985b24d4","/custom-payment-gateway/return-payment-methods","Return payment methods","Retourner les méthodes de paiement","b7d8c26b-e5f4-484b-a9ef-a5ca41f85393","136519945525","/custom-payment-gateway/checkout-screen","External checkout","Paiement externe","ec2a5724-5506-47b6-9c7a-d310bb4d0e09","aa53add73259","/custom-payment-gateway/server-side-processing","Server-side processing","Traitement côté serveur","bd87ce7d-0239-420a-9a18-862a9b6deb66","4ed2a6ce8bd9","/custom-payment-gateway/redirect-order-confirmation","Redirect customers","Rediriger les clients vers Snipcart","e2d6d233-29ec-4b16-ab36-56f868588988","e1b66edceecc","/custom-payment-gateway/refund-payments","Refund payments","Paiements des remboursements","6a85e846-fa51-410b-9709-7ff8cdd89f41","569a37399012","/custom-payment-gateway/tutorial","Tutorial: Google Pay","Tutoriel : Google Pay","9af20347-1724-4fac-8db6-adc33da0c35e","98ab29c4ef61","/custom-payment-gateway/technical-reference","Technical reference","Référence technique","1b6b88cc-39a0-486e-90d3-ede9e872b9f2","Custom payment gateway","61cb0bfb06a0","b024edbeb039","a1d79bb2-ed0b-4d69-9307-4dc381de6e60","f0b1bed30c4e","f63e3ad3-382f-4ac2-9935-f1275b7ae6c3","48f4c95f530f","c41c5d4f-4381-4c68-9d0c-fb3a7d329f0d","e6ad3d4da679","db83302dc1f0","47fdea683c65","de84dce9-5f6a-4813-a2d7-37c28b99d69d","103ea81a8c8f","e4dfbc3a-02ae-4604-a259-5b5189d531e8","51b6515636bc","666201e04a04","c419b3e240bf","f6c8e023-437e-4223-a9a7-4b3747c53731","986ab3a92333","936f652a-6bcb-4efd-b400-2ae02fa7b8bb","ba3536c135b9","43ecdf47ca2c","cd7ba04f-a8fe-468d-9fca-1725eaf6a7fd","19b188bc1a55","f9086567414b","c8b716de8866","f850a03b5f01","39809dc73095","9b3097d5-6456-427f-abde-3f4a0ba89fa4","b5e0d2ec1f25","5d9b9c748755","c1c4e307dd2a","aa824bbbe90d","6e0066de927f","b09130bd2488","62ceaaea8d3a","551c7a0a47a1","e6157c641659","594a93ba7710","2c2884a584d0","fe313fdf8bd1","2f0bdbc6ef59","0dacdbeb4268","07ac02a70ccb","7e82126553e8","330206f64118","c6934077f49d","d9c0a229f193","bbf5d766d79a","6b7887281cf8","daec53f67df3","76f6cdbdc745","3909b2163ee3","dec5aedf-b3f4-4f94-9baa-ce3fc6bf0f88","589889f37a6b","8fbb322c-10b3-4952-a3a9-34b62cca514a","858b7845c741","0c133347-9483-4a0e-85bb-427c0526c23d","5ee89489ffee","2496927b-dbd3-47e5-9bd4-b3d9f160ac60","4890b4ff36c8","/javascript-api/custom-validation","Custom validation","35e4f0d2-1047-4369-bfb0-4a1c8d5dbd47","Javascript API","4513cd33faee","14b10ee600d6","a7235b09213a","8215d5e00da1","9081f539df33","c51838d9467f","1923fd982292","9c2a598a3fbe","5e7e2599977f","35740d4f7ac7","8aa326c13f44","0f1f116d43ff","151c7d49f3a4","0db1a7e14b66","9050fb6daa4d","59ca8bcefd5a","f89bcde7d5e1","bd1a1711f21b","bd052759fc05","9c7942dcc6c7","1003dc63c5d9")