Skip to content

DOL Figma Component Registry - Index

auto-generated - re-run generator after Figma extraction to refresh

Source file: DOL Design System V2 (key: DqRd7UQkNGcdvYL5fwZxlf) Counts: 532 component sets · 2782 standalone components across 46 detail files

Filters: excluded 37 legacy-named · 5260 non-allowlisted (Icons + Emoji pages keep only Icon filled/* · Icon Filled/* · Icon 1.5/* · 3demoji/* · Program logo* · Checkbox-Radio* · .Checkbox-Radio* · Chip* · .Chip*)

3-tier access - pick the cheapest path for your task:

NeedUse
1 component key by exact namepython3 tools/lookup.py component <name> (precise, ~200 tokens output)
Variants + properties for 1 componentpython3 tools/lookup.py variants <name> OR open the detail file below
List all components on a pageThis index (preview) OR components/<slug>.md for full enumeration
Explore what DS hasThis index (~250 lines) - see categories below

Detail files (components/<slug>.md) carry the full variant property schemas. This index has 3-key preview per file for fast “does X exist?” checks.

Citation format: <component-name> → key abc123... (from index OR detail). For instantiation flow see workflows.md Workflow 5.


components/button.md · 40 sets · 1 standalone

Preview:

  • .Button icon783b9c782d5b6dd44d920768ffa84c2d7f9ffe6a (set)
  • .Button icon/Secondary/Size33eef6e4c376aa88e4863121357f25390f114360 (set)
  • .Button icon/Touch/Sizec9b37ba2dfb4f72ac258a1d6085a51e258ff915a (set)
  • … 38 more in detail file

components/input.md · 87 sets · 267 standalone

Preview:

  • .Input Item/Subtextbffa998abcc802f163c7338087a05ea2127ef9e1
  • Abkhaziad4be1d57c356851164da5859600b9c7ba0b9aba6
  • Afghanistan5d7f7f0f43dafbd0d2d75ea61f0740a8731b8734
  • … 351 more in detail file

components/input-number.md · 1 sets · 0 standalone

Preview:

  • InputNumber2a147eadeec4c4647c6b7584e4376ea89b0e41e8 (set)

components/select-input.md · 43 sets · 0 standalone

Preview:

  • .Select button/Size3964d6a1ec0a27aa7cb0f719092c61aa6e5e7c26 (set)
  • Dropdown content/Empty state search dropdown891bcb409423fa665ba6cee3cfbd420c0d872ab2 (set)
  • Dropdown item content/General9234d471cf53d213ece9e4428d5195c5dff3f633 (set)
  • … 40 more in detail file

components/datepicker.md · 11 sets · 5 standalone

Preview:

  • Date picker5591ebcf3686a303d28fab2e49d137646b25fcaf (set)
  • Date picker / Date Range dropdownacbbe2fb90c470598a8b51dcd22666675b7e7caa
  • Date picker / Date Range dropdown advance977e64f70f6e3471e534abc418eb7de27315445e
  • … 13 more in detail file

components/checkbox-radio.md · 4 sets · 0 standalone

Preview:

  • .Checkbox-Radio/Size/Groupbcff736ba19914cc85d49d4e83f8dbfadc4046aa (set)
  • .Checkbox-Radio/Size/Singleb2ae759635398fc57827ab126ff3125324fc9b72 (set)
  • Checkbox-Radio/Group7b55a3a1bec2810415da5a91538e5a3652e67b71 (set)
  • … 1 more in detail file

components/chip.md · 4 sets · 0 standalone

Preview:

  • .Chip select/Sizeceb5e058fd4d2f934f82b59238cb800644a8d399 (set)
  • .Chip/Sizedafc8cf8a1c944497e08a2626735edfa9a4d5545 (set)
  • Chipc5e584409bd8f67f12380a0320a8a3e0473501f3 (set)
  • … 1 more in detail file

components/table.md · 6 sets · 0 standalone

Preview:

  • Header content/Component typeb55601b7bad2e0a9ef11a249fc87e2148cdaaee5 (set)
  • Table cell content/General (Simple)4da2194493a0f1013378b870d7c3a2d661c9cefd (set)
  • Table cell header/Light style/Generalb24a01d9c90e450ee526d01e1733818e49ed007d (set)
  • … 3 more in detail file

components/uploader.md · 40 sets · 2 standalone

Preview:

  • .Layout/UploadFileComponenta79910a059bf0496549a5940e771bb84bf57499d (set)
  • .Upload/content/general file upload89c53a13ff54cce5e2db2029707cf8b09ecf655b (set)
  • Element/Select/Audio12644df35d5d3a67b07d0d4f251698d8988211ef (set)
  • … 39 more in detail file

components/modal.md · 18 sets · 18 standalone

Preview:

  • Bottom sheet template/Infoac74c4196f906ec24fde36bb93cc6a7c04c1a8e4
  • Bottom sheet template/Select774c66ba8edeb3f71dea533474737590252cd942
  • Bottom sheet/Dropdown w title4e4076c6f96398d6b604badc092c5c92121c4109
  • … 33 more in detail file

components/tooltip-dialog.md · 10 sets · 1 standalone

Preview:

  • Dialog box/Blue outline257629e81b8d78274a25bf1b21ed00147da69b8e (set)
  • Dialog box/Brand outlineb2de6dffb80a8c198142657d64e74270efdfb70f (set)
  • Dialog box/Primary98012ecaf82878cfde2f00c4b002e674e8d98e15 (set)
  • … 8 more in detail file

components/drawer.md · 1 sets · 3 standalone

Preview:

  • Drawer right/Footerd80e2581540f9801d364e6e10bdc2fff01c2c574
  • Drawer right/Header7805b8e62b5b5b0a9acc7ad85180c204aa987414
  • Filter drawer content/Sample filter list 2cb737ea2762b16d7d13cb5ad3365ca7dab57f59c
  • … 1 more in detail file

components/toast.md · 3 sets · 1 standalone

Preview:

  • Designlog/Toast4cf8ca565501cb06562e070939ec7ce597e93489
  • Toast alert/Style 177e54ef2d89268489523e088d84dc163a1134008 (set)
  • Toast alert/Style 1 vertical8ca4714c1428f3468b51b0ee50d05816c5ad5b64 (set)
  • … 1 more in detail file

components/popover.md · 8 sets · 2 standalone

Preview:

  • .Item/Tooltip arrow/Bottome2461da44b27aad99b940cab4b6af6576f8253f8 (set)
  • .Item/Tooltip arrow/Left07d342c44986253bb12b9f914b7544ee9e4dae07 (set)
  • .Item/Tooltip arrow/Rightad0c4da7e67abcf06e6fb1db5f693688c43f3b31 (set)
  • … 7 more in detail file

components/alert.md · 7 sets · 0 standalone

Preview:

  • .Alert/Simple tooltip/Element tooltip container2397d10ae53a7409e1130a7d7aca7fe0c9ed582d (set)
  • .Alert/Simple tooltip/Size7feb8328ba183847e8213caa566a2a2d5890bb11 (set)
  • Alert/Complex block Alert162e5c46948a8ae0694c7efbfbc4ed88c7de6796 (set)
  • … 4 more in detail file

components/sidebar.md · 15 sets · 0 standalone

Preview:

  • .Sidebar/Menu item/Content/HV General170cd0b4c1736104389ba07a3f4d680032631ef1 (set)
  • Menu drawer/Menu item/Student view/1st684df1ea21b1c103e86745b20d7a96e78219951c (set)
  • Sideba menu item content/Data check, nhập liệu06a3fa68e58ad66a9f53da7e24aea1c8f8e638fe (set)
  • … 12 more in detail file

components/tabbar-toggle.md · 16 sets · 0 standalone

Preview:

  • .Tabbar/Item/Tab button item line style7749cc1b98c97ddae0bded36140eab4c33352680 (set)
  • .Tag item/Sizec348fd08b4f5bc0fb02f5f5532abca3ebc053b14 (set)
  • Button icon secondary/Element tooltip containerd1fdedfbede8c17b0ecad4ac5e3029a55def84ca (set)
  • … 13 more in detail file

components/switch.md · 3 sets · 5 standalone

Preview:

  • .Layout/Switch group0a91cbbb5b362d9242121dd1cff47a6563ebb199
  • .master/switch/large/active2a9c332015c4b12e7c15926974eea3c266040a37
  • .master/switch/large/inactiveff386159e7dd61389537124583323664491bd001
  • … 5 more in detail file

components/footer.md · 1 sets · 0 standalone

Preview:

  • Footer/End Section5da8dbea2e5c5d246bf8d953a3ef4bab606718fd (set)

components/steps.md · 6 sets · 0 standalone

Preview:

  • Element/Process lined3525cac68e694f4ff1610087f883af6bfdc5a0a (set)
  • Element/Step icon3d5b80976325d2099cce801e2faa9b00c08175d1 (set)
  • Element/Step number label09bcc9899b297879e54050fd38b6a40dd0f7b32f (set)
  • … 3 more in detail file

components/avatar-user.md · 21 sets · 4 standalone

Preview:

  • .Avatar/Item/Edit buttonfe1f7629e8de530f12c48eabd1f15a136f8f8778
  • Avatar/Multi avatar displaye35fd61180c269b494f280625f3b8922977078e5 (set)
  • Badge item/Dạy thay status914ba8cf55158eb2cfdbab00c1e4673b022d90de (set)
  • … 22 more in detail file

components/media.md · 35 sets · 2 standalone

Preview:

  • .Audio player content/Audio simple with Wave sound96da217f7fb629a05e8028c0d48359d63e1d88bf (set)
  • Audio player item/Volume control4864e27089dc6cb584fae559f09fa62bf67d9b9a (set)
  • Audio player item/Volume control vertical6dbc93448b4db5c39df2b4f35cef9b68688056a9 (set)
  • … 34 more in detail file

components/text-content.md · 1 sets · 0 standalone

Preview:

  • Text content/Date differenceecb8a081ce0edf33e9c36d65accb5e3534dd719f (set)

components/report.md · 2 sets · 1 standalone

Preview:

  • Button/Bug Report36e54cadd39aec7733f10e6f24bf08a7e5632032 (set)
  • Modal/Report samplebbf35ec35fdfd0a810c9c528f63a711a77ec326d
  • Report form content samplee5940ec7b5eb5a2c226b2b30a77a7a15baf3b0e4 (set)

components/divider.md · 6 sets · 0 standalone

Preview:

  • .Dot slide/Dota35e36d3f77db2768f34c1ceba2d4125cb5492e5 (set)
  • Divider horizontalfbde413b35e3cb24ad409a2141f0d8af87bd2fa7 (set)
  • Divider vertical3bba03887bfb43608ee35486f4a2a65e48a90df9 (set)
  • … 3 more in detail file

components/pagination.md · 6 sets · 1 standalone

Preview:

  • Pagination item/Addition8a2ee3509ffc748b10e07edabdcde9a97aeb0323 (set)
  • Pagination item/Page number buttone121b11e9c9f06934a52e0fc94aedad3d6693be5 (set)
  • Pagination item/View per page024f7c453937eccc22568444b0756c95d4a26fee (set)
  • … 4 more in detail file

components/slider.md · 7 sets · 3 standalone

Preview:

  • .Slider/Item/Handle7e0321b7863f7fd11c15658cdb0582174e4e5242 (set)
  • .Slider/Item/Markcd223d2cccc3420ed883373440f2233ca8b3a1ab (set)
  • .Slider/Item/Rail12e6b746b37730f37dc65812b3aeb9d2e7791d8c (set)
  • … 7 more in detail file

components/badge.md · 2 sets · 0 standalone

Preview:

  • .Badge/Layoutc0707996866132bba99d529888e72718e7da2a09 (set)
  • Badge/Stylea950c442058baec91cb9b753cd65cb47b50cb4e4 (set)

components/empty-state.md · 5 sets · 0 standalone

Preview:

  • Content/Empty message13536c9e23046a6a973af1b3dba8f0f5973c9136 (set)
  • Empty state general2fbc11fdec00ccc3ece2797cbe3c844d117291d3 (set)
  • Empty state w imageb6bbda026f934a3893b2bed4bbabfa306bc58c7b (set)
  • … 2 more in detail file

components/tag.md · 8 sets · 0 standalone

Preview:

  • .Remove tag/Close icon/Generalcb6c255dde2b40a164f2dcb7c3795fff829c10ea (set)
  • .Remove tag/Close icon/Size4f9d096826e71dcf2b7b859255ff9d3b2a6e98af (set)
  • .Tag content/Layout964d4e10dcf31622d2b2c354097d6c9f3d6a58d7 (set)
  • … 5 more in detail file

components/progress.md · 5 sets · 3 standalone

Preview:

  • Line pattern 26bd820e613c712267876d85d0fbfd28792c24e5
  • Line pattern for charte76ecbcd97281c247e37d4265d439e94405c5337
  • Progress / Bar6dd1007154528cb95ab13a7ac8b18c1228acd1c3 (set)
  • … 5 more in detail file

components/collapse.md · 2 sets · 0 standalone

Preview:

  • Collapsea3698e91790e41a7f97076c83297acf5dc851c79 (set)
  • Simple content sample203abd2c885668d4e721d054e9fb3fe30d134e59 (set)

components/skeleton.md · 6 sets · 8 standalone

Preview:

  • Skeleton comps/content-blokf4ef4b70d2d1a80b470d8b9c1b1aa1d97335d299
  • Skeleton comps/imga214df57fd6ef4720a2f9904800ef8992fd727cc (set)
  • Skeleton comps/img-large597978fa88c5b3e22fafe16df3806860d43a9688
  • … 11 more in detail file

components/breadcrumb.md · 5 sets · 0 standalone

Preview:

  • .Breadcrumb Item master8d9ef0f0ef566f0cdc343f21a205fbbb994192b4 (set)
  • Breadcrumb Item840489f10658982e8117ad3af3a98808b76aefb9 (set)
  • Breadcrumb Item/Arrowd01eda264b05ecb367e62c78332358b64ff682ea (set)
  • … 2 more in detail file

components/rate.md · 2 sets · 0 standalone

Preview:

  • Rate/Rate itembdf6f36f54228288e5981fb5f6344b3071a31f1f (set)
  • Rate/Stars group9bff8f6e5841934fd75288d20642ff0e01b0a585 (set)

components/logo.md · 22 sets · 15 standalone

Preview:

  • Beta badge88292901c9130d47cb645a44a3df6cfb797207dc
  • DOL AI4acd45705b1ab7c2c7f9171afd8c6c93bec6c658
  • DOL AI Alpha3ad88c534df928f9de9cd8067d70f0ddec952489
  • … 34 more in detail file

components/program-logo.md · 1 sets · 0 standalone

Preview:

  • Program logo8ae2822d66cf8d6605edb4f11356c9fc2afb5152 (set)

components/scroller.md · 6 sets · 0 standalone

Preview:

  • .Scroller/Base thumb1ab88e4beb77c8dc049407bd52214958466143ce (set)
  • .Scroller/Horizontal/Position9a9fe2d6f62dd70435a4f7e47fc67d76f1089a3c (set)
  • .Scroller/Positioncc196dfc4c00db39c1070a1850a2b7c6ff7ce54b (set)
  • … 3 more in detail file

components/order-number.md · 3 sets · 0 standalone

Preview:

  • .Element/Order number/Layout5f4a9ebf9a2ce185f0ebcca18337b75c784f05fa (set)
  • Element/Order number 2ae1ba573695ec82db5f7dbeb727578590a5bf7a (set)
  • Element/Order number nhỏ xíu6194080b7012ef6d42068b19f901e2573ac9f78e (set)

components/question.md · 3 sets · 1 standalone

Preview:

  • .Master/Answer73d7de2e5fae3542f1902b124664ce8970715451 (set)
  • .Master/Question Number0e7d5f9ddc6867114dbee015bde1c8e085afe17b
  • Question item/Answer node (OLD)cb4fd2ea3097d17be43b87320089fdcbc09ae019 (set)
  • … 1 more in detail file

components/scores.md · 2 sets · 0 standalone

Preview:

  • Element/Percent score circleecbe2e6864a17819c925fbaefaad5c63607c2612 (set)
  • Element/Score circle3afd1c3cd87441ae2cedecd6d3190e3efb41db28 (set)

components/lms-role-sidebar.md · 56 sets · 15 standalone

Preview:

  • Sidebar IELTS/Create syllabus/CD328a8a91347d7dbea21bce6d150112269864e949
  • Sidebar/Manage/Root admin30852e03a3015d43d528e047a31da59d637c8f3f
  • [L] Button/Sidebar collapes - Expanda1a2290a9ca3bbdaf295d214b6bb1569bcab8c69 (set)
  • … 68 more in detail file

Mockup UI (Status bar, Indicator, Browser)

Section titled “Mockup UI (Status bar, Indicator, Browser)”

components/mockup-ui.md · 2 sets · 14 standalone

Preview:

  • Mockup UI element / Chrome / Access microphoneb1f563f8f50edbccfd863faa712a5c4373ca0f6b
  • Mockup UI element / Home Indicatorc3141e432460ce563e10d15a28aa5d72ff06b379
  • Mockup UI element / MacOS / Chrome Header — Darkc40d28249998d1bfb5ff9bce0e36d8ae7ca36e84
  • … 13 more in detail file

components/icon-1-5.md · 0 sets · 979 standalone

Preview:

  • Icon 1.5//AI feature/Search add, plusfe81a066463038009a9e3fadeaebaa750fbfd741
  • Icon 1.5//AI feature/Search practicec4dea595cf58579ec6736893f000d78048312e95
  • Icon 1.5/AI feature/AI Bookb40fcf4f5de3e251eeca55319b01861fcab47309
  • … 976 more in detail file

components/icon-filled.md · 0 sets · 156 standalone

Preview:

  • Components/Icons/Course/Heart369b81adf3ce093d63c787b2f40982884854fcb8
  • Components/Icons/Course/info filla2be33fe96481d67d190b5d4d9eac754f0005068
  • Components/Icons/Course/minus fill91f2065b2e17469f18023f86e2295b5a3d4fa3a0
  • … 153 more in detail file

components/emoji-3d.md · 0 sets · 1275 standalone

Preview:

  • 3demoji/Activity/1st place medal1d15e8770110ffc5ace48046edddde686e59e2df
  • 3demoji/Activity/2nd place medald43b39d6eee1cbfbdfc80f6fbde7aafc8396bb05
  • 3demoji/Activity/3rd place medald70a4e3a88d3e27d47e2b16f5ad3d165245d2e90
  • … 1272 more in detail file

  • tools/lookup.py - CLI for precise queries (component / variants / search / etc.)
  • variable-registry.md - variable resolved values + Tailwind mapping
  • variable-id-map.md - variable name ↔ Figma ID + collection IDs
  • variable-selection.md - intent → variable decision tree
  • workflows.md - 5 runbooks (bind / extract / mode-audit / DELETED-cleanup / instantiate)
  • naming-convention.md - 4-category semantic rule + anti-patterns
  • tools/resync-figma.md - re-extract metadata when DS changes