Why does the dropdown need an API key?

It runs on your public key (developers may know it as a publishable key), the one starting with vdb_pk_. That key is built to be seen: you paste it straight into your pages, and all it can do is fill in makes and models. In Settings you can tie it to your own domains, so nobody can lift it and use it on their own site. Dropdown requests cost 0 credits, so the widget never spends your quota.

For JavaScript developers

The car make and model dropdown

A dependent make and model picker for any form: 15,068 vehicles across 934 makes. Cars, motorcycles, mopeds, vans, trucks and buses, reconciled from the official registers of 18 countries and refreshed monthly. Zero dependencies. One script tag. You can finally delete that makes array you have been maintaining by hand.

Make

Model

Model year

value: {"make":null,"model":null,"year":null}

Live: the 40 most-registered makes. Type to search, pick a make, models and years follow.

Get your free API key Get your embed code

Your dropdown, live in 5 minutes. No card needed.

Not a developer? The embed code is made for your website: type its address, copy one block, paste.

Playground

Kind Country searchable logos

The embed for what you just configured

The whole integration

1. One script tag (or npm install make-model-dropdown)

<script src="https://cdn.jsdelivr.net/npm/make-model-dropdown@0.1.4"></script>

2. Two selects and one call

<select id="make"></select>
<select id="model"></select>

<script>
  VehiclesDropdown.attach({
    key: "vdb_pk_YOUR_KEY",
    make: "#make",
    model: "#model"
  })
</script>

Step 3 is the key: create a free public key, tie it to your domain, and ship. Your domain covers its www. form too; list any other subdomain, or use *.example.com for all of them. Dropdown requests cost 0 credits, so the widget never touches your quota.

Get your free API key

One widget, every vehicle kind

The same line of JavaScript is a car picker, a motorcycle picker or a truck picker. Pass kind: and the whole list narrows.

Cars 5,541 models

Every hatchback, wagon, SUV and roadster on real roads, popularity ordered so the Golf outranks the 412.

kind: "car"

Motorcycles 6,033 models

A motorbike make and model dropdown the way riders speak: displacement level names, CBR600RR rather than CBR.

kind: "motorcycle"

Trucks 947 models

Truck makes and models for fleet, logistics and marketplace forms: pickups, rigids and the giants of the motorway.

kind: "truck"

Vans 739 models

Campers, panel vans and people movers, the workhorses behind every trade and rental form.

kind: "van"

Mopeds 1,399 models

Scooters and the small machines that move whole cities.

kind: "moped"

Buses 409 models

Buses, coaches and minibuses for the biggest fleets of all.

kind: "bus"

What the data knows that a hardcoded list never will

Popularity that is real

Every model carries a decile from actual registration counts. order: "popular" puts what people drive first.

Country availability

country: "de" drops what Germany has never registered. 18 register countries, evidence based.

Make logos, safely

logos: true renders badges beside make names, with an automatic initial letter fallback when a marque has none.

Searchable

search: true swaps the select for an accessible combobox. Type gol, get the Golf.

Never a dead end

includeOther appends Other / not listed, and the resolve endpoint turns free text into canonical ids server side.

Fresh by construction

The dataset reships monthly from official registers. Your dropdown updates without a deploy on your side.

Ask for the model year new in 0.2.0

Booking and quote forms ask for the year, so the widget can fill a third select. Pick a model and it lists the years the official registers have that model on record, newest first, because most bookings are for recent cars. These are register years, not the factory's production dates. The years come with the model list, so the step makes no extra request.

year: "#year"

The model year select. It fills when a model is picked and clears when the make changes. placeholderYear sets its empty label (Year by default).

initialYear: 2019

Preselects a year once its model's years fill. A year already selected in your server rendered form works too, and a form reset restores it.

yearFallback: "range"

For a model the registers have no span for. "range", the default, offers this year back 40 years, so the form never reaches a dead end. "none" offers no years, keeping Other with includeOther and disabling the select when nothing is left to choose.

Three selects and one call

VehiclesDropdown.attach({
  key: "vdb_pk_YOUR_KEY",
  make: "#make",
  model: "#model",
  year: "#year",
  onChange: ({ make, model, year }) => {
    // { make: "volkswagen", model: "golf", year: 2019 }
  }
})

year is a number, null while nothing is picked, or "other" with includeOther. Without a year select the payload stays { make, model }, exactly as before.

Works where your form lives

One widget, any stack. Pick yours.

One script tag, two selects, done. The form submits like any other.

<form method="post">
  <select id="make" name="make"></select>
  <select id="model" name="model"></select>
  <button>Get a quote</button>
</form>

<script src="https://cdn.jsdelivr.net/npm/make-model-dropdown@0.1.4"></script>
<script>
  VehiclesDropdown.attach({ key: "vdb_pk_YOUR_KEY", make: "#make", model: "#model" })
</script>

Attach on mount, destroy on unmount. The selects stay native.

import { useEffect, useRef } from "react"
import VehiclesDropdown from "make-model-dropdown"

function VehiclePicker() {
  const make = useRef(), model = useRef()
  useEffect(() => {
    const picker = VehiclesDropdown.attach({
      key: "vdb_pk_YOUR_KEY", make: make.current, model: model.current
    })
    return () => picker.destroy()
  }, [])
  return <><select ref={make} /><select ref={model} /></>
}

Same idea with template refs. Nothing in the widget is specific to any framework.

<script setup>
import { onMounted, onUnmounted, useTemplateRef } from "vue"
import VehiclesDropdown from "make-model-dropdown"

const make = useTemplateRef("make"), model = useTemplateRef("model")
let picker
onMounted(() => {
  picker = VehiclesDropdown.attach({
    key: "vdb_pk_YOUR_KEY", make: make.value, model: model.value
  })
})
onUnmounted(() => picker?.destroy())
</script>

<template><select ref="make" /><select ref="model" /></template>

Forms rendered on your server want the vehicles gem instead (github.com/vehiclesdb/vehicles): the same dataset, offline. The widget is its twin for the browser.

# Gemfile
gem "vehicles"

# A dependent picker with NO network calls: the same dataset ships
# inside the gem, offline, plus validators and popularity helpers.
form.select :make,  Vehicles.make_options
form.select :model, Vehicles.model_options(car.make)

The database underneath

15,068

models

934

makes

official registers

2026.10.3

dataset version

A model ships only when at least two independent official sources agree. Browse it all in the catalog, read the measured error rate, or go deeper with the full API: resolve free text to canonical ids, full spec records, imagery and license plate validation.

Questions developers ask

Yes. The identity layer (makes, models, kinds, slugs) is CC-BY 4.0: free for commercial use with visible credit, which the widget renders for you. The API key is free too.

Six kinds: cars, motorcycles (motorbikes), mopeds, vans, trucks and buses. Pass kind: "motorcycle" for a bike picker with displacement level names, or kind: "truck" for a commercial vehicle picker. Same widget, same one line.

Official vehicle registers of 18 countries, reconciled: a model ships only when at least two independent sources agree. Popularity comes from real registration counts, refreshed monthly.

Yes. The widget enhances native select elements, so your form submits the same values with or without it. Attach it from any framework, or use no framework at all.

Turn on includeOther and the picker appends an Other / not listed option, so your form never reaches a dead end. You can also send free text to the resolve endpoint from your own server.

Ship the dropdown today

A free public key, safe in your page source and tied to your own domains. Dropdown requests cost 0 credits. Your account comes with a private key too, for the day you want the rest of the VehiclesDB API.

Get your free API key Read the API docs