A premium theme can save weeks of work or quietly cost you months. The difference rarely shows up in the live demo, which is designed to look great. It shows up when you open the codebase, upgrade a dependency, run an accessibility audit or try to change the brand colors across fifty components.
This checklist is what we would want every developer, founder and agency to run through before buying a theme in 2026 — including the ones on our own themes marketplace. It covers code quality signals, framework versions, TypeScript, accessibility, performance, licensing, documentation, updates, support, dependency security and customization, then wraps everything into a simple scoring table you can reuse on your next project.
Code quality signals you can check in minutes
You usually cannot inspect the full source before purchase, but you can learn a lot from the demo, the documentation, screenshots of the file tree and any public changelog. If the vendor offers a preview repository or sample files, even better. Look for:
- A predictable project structure. Clear separation between components, layouts, pages or routes, utilities, styles and configuration. Folders named
new-components-2oroldare a warning sign. - Consistent linting and formatting. An ESLint config, Prettier (or Biome) config and an
.editorconfigsignal that the code is maintained by people who care about consistency. - Reusable components over copy-paste. If five landing page variants each contain their own hand-rolled button, every change later means five edits.
- Clean browser console. Open DevTools on the demo. Hydration warnings, 404s for assets, or React key warnings in a sales demo suggest what the code looks like on a normal day.
- Sensible data boundaries. Content and mock data should live in dedicated files or a CMS layer, not hard-coded inside JSX across dozens of components.
For Web3 and mobile themes
Blockchain themes deserve extra scrutiny. Check whether smart contracts are included, which Solidity version they target, whether tests ship with them, and whether they use well-known libraries such as OpenZeppelin rather than hand-written token logic. Wallet connection should rely on maintained libraries (for example wagmi and viem on the web). For Flutter apps, look at state management choices, null safety, and how secrets and private keys are handled — our guide on Flutter crypto wallet app architecture covers what good looks like.
Framework versions and TypeScript
Framework age matters more than it seems. A theme built on a framework version that is several majors behind will force you into an upgrade project before you have shipped anything.
- Next.js themes should use the App Router for new projects, with server components where they make sense. Pages Router is still supported, but new features and most community examples now target the App Router.
- React should be on a current major version, compatible with the framework version used.
- Tailwind CSS themes should state which major version they use. Tailwind v4 moved configuration toward CSS-first theme variables, so a v3 theme and a v4 theme are customized quite differently.
- Flutter themes should target a recent stable channel with sound null safety and declare the minimum Dart SDK.
- Solidity contracts should use a recent 0.8.x compiler, which includes checked arithmetic by default.
TypeScript is close to a baseline expectation for JavaScript themes in 2026. Check that strict mode is enabled rather than a TypeScript project littered with any. Typed props, typed API responses and typed contract ABIs catch entire categories of bugs when you start customizing.
{
"compilerOptions": {
"strict": true,
"noUncheckedIndexedAccess": true,
"moduleResolution": "bundler",
"paths": { "@/*": ["./src/*"] }
}
}
package.json or pubspec.yaml before you buy. It reveals framework versions, dependency count and tooling choices in about thirty seconds.Accessibility and performance
Accessibility
Accessibility is not a feature you can bolt on cheaply at the end. If the underlying components are inaccessible, you will be rewriting them. Test the demo yourself:
- Navigate the entire page with only the keyboard. Can you reach and operate every menu, modal, tab and form? Is the focus indicator visible?
- Open a modal and press Escape. Does focus return to the element that opened it?
- Run an automated checker such as Lighthouse or axe DevTools. Automated tools catch only part of the issues, but a poor score is a reliable red flag.
- Check color contrast on buttons, muted text and text over images, in both light and dark mode.
- Look for semantic HTML: real
<button>elements rather than clickable<div>s, labelled form fields, one logical heading hierarchy, and meaningfulalttext.
Aim for WCAG 2.2 AA as the target. Beyond being the right thing to do, accessibility requirements are part of legal and procurement obligations in many markets, and agencies increasingly need to demonstrate conformance to clients.
Performance
Run PageSpeed Insights or Lighthouse on the demo, on mobile settings, for several pages — not just the home page. Look at Largest Contentful Paint, Interaction to Next Paint and Cumulative Layout Shift, and at total JavaScript shipped. A demo that already struggles will only get slower once you add analytics, real images and your own features. Our deep dive on hitting 90+ PageSpeed with Next.js explains what to look for in detail.
Quick signals of a performance-conscious theme include optimized image components with explicit dimensions, self-hosted fonts, no giant animation libraries loaded on every page, and client-side JavaScript limited to the parts that are genuinely interactive.
Licensing: Regular vs. Extended
Licensing is where well-meaning buyers most often get into trouble. Most theme marketplaces, including ours, distinguish between two broad license types. The exact wording is what counts, so always read the license terms for the product you are buying, but the general pattern looks like this:
| Question | Regular license (typical) | Extended license (typical) |
|---|---|---|
| Number of end products | One end product | One end product |
| End users charged for access? | Generally not permitted | Permitted |
| Typical use | Company site, portfolio, client site, free app | SaaS, paid membership platform, paid app |
| Resell or redistribute the theme itself | Not permitted | Not permitted |
The key question is usually “will end users pay to use the thing I build?” If you are building a SaaS product, a paid dApp or a subscription platform on top of a theme, you likely need an Extended license. Agencies building for clients should also check whether the license can be transferred to the client and whether each client project requires its own license — it almost always does. Compare options on the pricing page before you commit, because upgrading later can cost more than buying the right license up front.
Documentation, update cadence and support
Documentation
Good documentation turns a theme from a folder of files into a product. At a minimum it should cover installation, environment variables, project structure, how to change colors, fonts and logos, how to add a page, how to deploy, and how to upgrade between theme versions. For Web3 themes, add contract deployment, network configuration and how the frontend reads contract addresses. For mobile themes, add build and signing instructions for both platforms.
A useful test: pick one specific customization you know you need, such as “change the primary color and swap the font”, and see whether the docs answer it without a support ticket.
Update cadence
Look for a public changelog with dated entries. You are not looking for weekly releases; you are looking for evidence that the theme tracks major framework releases and fixes reported issues. A theme whose last update was two framework versions ago is effectively unmaintained. Also check how updates are delivered: if every update requires you to diff an entire zip file against your customized project, plan for that effort, or favor themes whose architecture isolates your customizations (for example through configuration and design tokens).
Support
Clarify what support includes and for how long. Typical support covers bugs and questions about included features, not custom development. Know the channel (ticket, email, forum), the expected response time and whether support renews. If you anticipate substantial changes, a vendor that also offers customization and installation services can save you a lot of back-and-forth.
Security of dependencies
Every dependency is code you did not write but are responsible for shipping. Supply chain attacks against package ecosystems have become a recurring problem, so treat the dependency tree as part of your evaluation.
- Count the dependencies. A landing page theme with hundreds of direct dependencies is harder to secure and slower to build.
- Run an audit. After purchase, run
npm audit,pnpm auditorflutter pub outdatedimmediately, and check for abandoned packages. - Check the lockfile. A committed lockfile means reproducible installs. Its absence means you may install different versions than the author tested.
- Look for secrets. Search the codebase for API keys, private keys or mnemonics. Themes should use environment variables with an
.env.examplefile, never real credentials. - Review Web3 specifics. Contract code should be tested and ideally reviewed; our smart contract security checklist is a good starting point. Never deploy included contracts with real value without your own review.
# First things to run after unzipping a JavaScript theme
npm ci # install exactly what the lockfile specifies
npm audit --omit=dev # known vulnerabilities in production deps
npx depcheck # unused dependencies you can remove
grep -rniE "(api[_-]?key|secret|mnemonic|private[_-]?key)" src/
Customization and design tokens
The best themes are built to be changed. The most reliable indicator is a design token system: colors, typography, spacing, radii and shadows defined once as variables and referenced everywhere else. With tokens, rebranding is a matter of editing a small file. Without them, it is a search-and-replace across hundreds of hard-coded hex values.
@theme {
--color-brand-500: oklch(0.62 0.19 264);
--color-brand-600: oklch(0.55 0.2 264);
--font-sans: "Inter", system-ui, sans-serif;
--radius-card: 1rem;
}
Questions to ask:
- Is there a single source of truth for colors and typography, and does dark mode derive from it?
- Are components composable, accepting variants and class overrides, or are styles baked in?
- Are sections and blocks modular, so you can build new pages by combining them?
- Is content separated from layout, ideally ready to connect to a headless CMS?
Our guide to Tailwind theme customization with design tokens walks through this approach step by step.
Red flags and a scoring table
Red flags
- No changelog, or a last update more than a year ago.
- Framework versions multiple majors behind current releases.
- Console errors or broken links in the live demo.
- Vague or missing license terms.
- “Documentation” that is only a README with installation steps.
- Smart contracts with no tests, or custom token logic instead of audited libraries.
- Hard-coded secrets, RPC keys or test mnemonics in the source.
- Poor mobile experience in the demo.
- Claims such as “100% secure” or “audited” without naming who audited what.
The demo shows you what the theme looks like. The changelog, the docs and the dependency list show you what it will be like to live with.
A reusable scoring table
Score each criterion from 0 (poor) to 3 (excellent), multiply by the weight, and add everything up. Adjust weights to your project: a marketing site may weight performance higher, while a dApp should weight security higher.
| Criterion | What “3” looks like | Weight |
|---|---|---|
| Code quality | Clean structure, linting, reusable components, clean console | 3 |
| Framework currency | Current major versions, modern routing and tooling | 2 |
| TypeScript | Strict mode, typed props and data, minimal any | 2 |
| Accessibility | Keyboard operable, semantic HTML, good contrast, targets WCAG 2.2 AA | 3 |
| Performance | Strong mobile Lighthouse scores across several pages | 3 |
| Licensing clarity | Clear Regular/Extended terms, third-party assets listed | 2 |
| Documentation | Covers setup, customization, deployment and upgrades | 2 |
| Update cadence | Dated changelog tracking framework releases | 2 |
| Support | Defined channel, response time and duration | 1 |
| Dependency security | Lean tree, lockfile, clean audit, no secrets | 3 |
| Customization | Design tokens, composable components, modular sections | 2 |
The maximum score with these weights is 75. As a rough guide, anything above 60 is a strong candidate, 45 to 60 is workable if the gaps are in areas you can fix cheaply, and below 45 suggests you may spend more time repairing the theme than you save by using it.
Conclusion
Choosing a premium theme is an engineering decision, not just a design one. Check the code, the framework versions and the TypeScript setup. Test accessibility and performance yourself. Read the license properly, and match it to how you will make money. Look for real documentation, a living changelog, clear support and a lean, secure dependency tree. And favor themes built around design tokens, because you will customize more than you expect. Run through this checklist, score your options, and you will buy a foundation instead of a future rewrite.
Browse the Coodes theme collection with this checklist in hand, and if you need a theme adapted to your brand or stack, our development services team can take it from purchase to production.
