diff --git a/src/lib/components/MainFooter.svelte b/src/lib/components/MainFooter.svelte
index a6161ae289c..c4e6749cda5 100644
--- a/src/lib/components/MainFooter.svelte
+++ b/src/lib/components/MainFooter.svelte
@@ -20,7 +20,7 @@
 		},
 		{
 			icon: 'aw-icon-x',
-			link: 'https://twitter.com/appwrite'
+			link: 'https://twitter.com/intent/follow?screen_name=appwrite'
 		},
 		{
 			icon: 'aw-icon-linkedin',
diff --git a/src/partials/auth-events.md b/src/partials/auth-events.md
new file mode 100644
index 00000000000..e7ebf909b48
--- /dev/null
+++ b/src/partials/auth-events.md
@@ -0,0 +1,32 @@
+## Authentication events {% #authentication-events %}
+
+| Name                                   | Payload                            | Description                                         |
+|----------------------------------------|------------------------------------|-----------------------------------------------------|
+| `teams.*`                              | [Team Object](/docs/models/team)    | This event triggers on any teams event.             |
+| `teams.*.create`                       | [Team Object](/docs/models/team)    | This event triggers when a team is created.         |
+| `teams.*.delete`                       | [Team Object](/docs/models/team)    | This event triggers when a team is deleted.         |
+| `teams.*.memberships.*`                | [Membership Object](/docs/models/membership) | This event triggers on any team memberships event.  |
+| `teams.*.memberships.*.create`         | [Membership Object](/docs/models/membership) | This event triggers when a membership is created.  |
+| `teams.*.memberships.*.delete`         | [Membership Object](/docs/models/membership) | This event triggers when a membership is deleted.  |
+| `teams.*.memberships.*.update`         | [Membership Object](/docs/models/membership) | This event triggers when a membership is updated.  |
+| `teams.*.memberships.*.update.status`  | [Membership Object](/docs/models/membership) | This event triggers when a team memberships status is updated. |
+| `teams.*.update`                       | [Team Object](/docs/models/team)    | This event triggers when a team is updated.         |
+| `teams.*.update.prefs`                 | [Team Object](/docs/models/team)    | This event triggers when a team's preferences are updated.  |
+| `users.*`                              | [User Object](/docs/models/user)    | This event triggers on any user's event.            |
+| `users.*.create`                       | [User Object](/docs/models/user)    | This event triggers when a user is created.         |
+| `users.*.delete`                       | [User Object](/docs/models/user)    | This event triggers when a user is deleted.         |
+| `users.*.recovery.*`                   | [Token Object](/docs/models/token)  | This event triggers on any user's recovery token event.  |
+| `users.*.recovery.*.create`            | [Token Object](/docs/models/token)  | This event triggers when a recovery token for a user is created.  |
+| `users.*.recovery.*.update`            | [Token Object](/docs/models/token)  | This event triggers when a recovery token for a user is validated.  |
+| `users.*.sessions.*`                   | [Session Object](/docs/models/session)  | This event triggers on any user's sessions event.  |
+| `users.*.sessions.*.create`            | [Session Object](/docs/models/session)  | This event triggers when a session for a user is created.  |
+| `users.*.sessions.*.delete`            | [Session Object](/docs/models/session)  | This event triggers when a session for a user is deleted.  |
+| `users.*.update`                       | [User Object](/docs/models/user)    | This event triggers when a user is updated.         |
+| `users.*.update.email`                 | [User Object](/docs/models/user)    | This event triggers when a user's email address is updated.  |
+| `users.*.update.name`                  | [User Object](/docs/models/user)    | This event triggers when a user's name is updated.  |
+| `users.*.update.password`              | [User Object](/docs/models/user)    | This event triggers when a user's password is updated.  |
+| `users.*.update.prefs`                 | [User Object](/docs/models/user)    | This event triggers when a user's preferences is updated.  |
+| `users.*.update.status`                | [User Object](/docs/models/user)    | This event triggers when a user's status is updated.  |
+| `users.*.verification.*`               | [Token Object](/docs/models/token)  | This event triggers on any user's verification token event.  |
+| `users.*.verification.*.create`        | [Token Object](/docs/models/token)  | This event triggers when a verification token for a user is created.  |
+| `users.*.verification.*.update`        | [Token Object](/docs/models/token)  | This event triggers when a verification token for a user is validated.  |
\ No newline at end of file
diff --git a/src/partials/databases-events.md b/src/partials/databases-events.md
new file mode 100644
index 00000000000..c41ba581af0
--- /dev/null
+++ b/src/partials/databases-events.md
@@ -0,0 +1,22 @@
+## Databases events {% #databases-events %}
+
+| Name            | Payload                        | Description                             |
+| ----------------------------------------- | ------------------------------ | --------------------------------------- |
+| `databases.*`                             | [Database Object](/docs/models/database)     | This event triggers on any database event. |
+| `databases.*.collections.*`               | [Collection Object](/docs/models/collection) | This event triggers on any collection event. |
+| `databases.*.collections.*.attributes.*`  | [Attribute Object](/docs/models/attribute)   | This event triggers on any attributes event. |
+| `databases.*.collections.*.attributes.*.create` | [Attribute Object](/docs/models/attribute)   | This event triggers when an attribute is created. |
+| `databases.*.collections.*.attributes.*.delete` | [Attribute Object](/docs/models/attribute)   | This event triggers when an attribute is deleted. |
+| `databases.*.collections.*.create`       | [Collection Object](/docs/models/collection) | This event triggers when a collection is created. |
+| `databases.*.collections.*.delete`       | [Collection Object](/docs/models/collection) | This event triggers when a collection is deleted. |
+| `databases.*.collections.*.documents.*`  | [Document Object](/docs/models/document)     | This event triggers on any documents event. |
+| `databases.*.collections.*.documents.*.create` | [Document Object](/docs/models/document)     | This event triggers when a document is created. |
+| `databases.*.collections.*.documents.*.delete` | [Document Object](/docs/models/document)     | This event triggers when a document is deleted. |
+| `databases.*.collections.*.documents.*.update` | [Document Object](/docs/models/document)     | This event triggers when a document is updated. |
+| `databases.*.collections.*.indexes.*`     | [Index Object](/docs/models/index)         | This event triggers on any indexes event. |
+| `databases.*.collections.*.indexes.*.create` | [Index Object](/docs/models/index)         | This event triggers when an index is created. |
+| `databases.*.collections.*.indexes.*.delete` | [Index Object](/docs/models/index)         | This event triggers when an index is deleted. |
+| `databases.*.collections.*.update`        | [Collection Object](/docs/models/collection) | This event triggers when a collection is updated. |
+| `databases.*.create`                     | [Database Object](/docs/models/database)     | This event triggers when a database is created. |
+| `databases.*.delete`                     | [Database Object](/docs/models/database)     | This event triggers when a database is deleted. |
+| `databases.*.update`                     | [Database Object](/docs/models/database)     | This event triggers when a database is updated. |
diff --git a/src/partials/functions-events.md b/src/partials/functions-events.md
new file mode 100644
index 00000000000..20f59c35f8c
--- /dev/null
+++ b/src/partials/functions-events.md
@@ -0,0 +1,16 @@
+## Functions events {% #functions-events %}
+
+| Name                                        | Payload                          | Description                               |
+| ------------------------------------------- | --------------------------------- | ----------------------------------------- |
+| `functions.*`                               | [Function Object](/docs/models/function)     | This event triggers on any functions event. |
+| `functions.*.create`                        | [Function Object](/docs/models/function)     | This event triggers when a function is created. |
+| `functions.*.delete`                        | [Function Object](/docs/models/function)     | This event triggers when a function is deleted. |
+| `functions.*.deployments.*`                | [Deployment Object](/docs/models/deployment) | This event triggers on any deployments event. |
+| `functions.*.deployments.*.create`         | [Deployment Object](/docs/models/deployment) | This event triggers when a deployment is created. |
+| `functions.*.deployments.*.delete`         | [Deployment Object](/docs/models/deployment) | This event triggers when a deployment is deleted. |
+| `functions.*.deployments.*.update`         | [Deployment Object](/docs/models/deployment) | This event triggers when a deployment is updated. |
+| `functions.*.executions.*`                | [Execution Object](/docs/models/execution)   | This event triggers on any executions event. |
+| `functions.*.executions.*.create`         | [Execution Object](/docs/models/execution)   | This event triggers when an execution is created. |
+| `functions.*.executions.*.delete`         | [Execution Object](/docs/models/execution)   | This event triggers when an execution is deleted. |
+| `functions.*.executions.*.update`         | [Execution Object](/docs/models/execution)   | This event triggers when an execution is updated. |
+| `functions.*.update`                      | [Function Object](/docs/models/function)     | This event triggers when a function is updated. |
\ No newline at end of file
diff --git a/src/partials/storage-events.md b/src/partials/storage-events.md
new file mode 100644
index 00000000000..70813ae29b3
--- /dev/null
+++ b/src/partials/storage-events.md
@@ -0,0 +1,12 @@
+## Storage events {% ##storage-events %}
+
+| Name                            | Payload                                        | Description                                  |
+|---------------------------------|-------------------------------------------------|----------------------------------------------|
+| `buckets.*`                     | [Bucket Object](/docs/models/bucket)            | This event triggers on any buckets event.    |
+| `buckets.*.create`              | [Bucket Object](/docs/models/bucket)            | This event triggers when a bucket is created.|
+| `buckets.*.delete`              | [Bucket Object](/docs/models/bucket)            | This event triggers when a bucket is deleted.|
+| `buckets.*.files.*`             | [File Object](/docs/models/file)                | This event triggers on any files event.      |
+| `buckets.*.files.*.create`      | [File Object](/docs/models/file)                | This event triggers when a file is created.  |
+| `buckets.*.files.*.delete`      | [File Object](/docs/models/file)                | This event triggers when a file is deleted.  |
+| `buckets.*.files.*.update`      | [File Object](/docs/models/file)                | This event triggers when a file is updated.  |
+| `buckets.*.update`              | [Bucket Object](/docs/models/bucket)            | This event triggers when a bucket is updated.|
\ No newline at end of file
diff --git a/src/routes/docs/Sidebar.svelte b/src/routes/docs/Sidebar.svelte
index f1feb57c85f..f4198d397ae 100644
--- a/src/routes/docs/Sidebar.svelte
+++ b/src/routes/docs/Sidebar.svelte
@@ -76,7 +76,7 @@
 			items: [
 				{
 					label: 'Command Line',
-					href: '/docs/tooling/command-line',
+					href: '/docs/tooling/command-line/installation',
 					icon: 'icon-terminal'
 				},
 				{
@@ -106,7 +106,7 @@
 				},
 				{
 					label: 'Self-hosting',
-					href: '/docs/advanced/self-hosting',
+					href: '/docs/advanced/self-hosting/installation',
 					icon: 'icon-server'
 				}
 			]
diff --git a/src/routes/docs/advanced/platform/events/+page.markdoc b/src/routes/docs/advanced/platform/events/+page.markdoc
index 91acaa412a7..2423dee4e3c 100644
--- a/src/routes/docs/advanced/platform/events/+page.markdoc
+++ b/src/routes/docs/advanced/platform/events/+page.markdoc
@@ -12,10 +12,17 @@ You can subscribe to events for specific resources using their ID or subscribe t
 You can also filter for events of specific actions like create, update, or delete. 
 You can find a list of events for Storage, Databases, Functions, and Authentication services below.
 
-[TODO: Need to add events here.]
 
+{% partial file="auth-events.md" /%}
 
-## Known limitations
+{% partial file="databases-events.md" /%}
+
+{% partial file="storage-events.md" /%}
+
+{% partial file="functions-events.md" /%}
+
+
+## Known limitations {% known-limitations %}
 
 When events fire, only existing subscriptions for that event will receive the update. If your client or server side integrations lose network connection temporarily, delivery of the event is not guaranteed.
 
diff --git a/src/routes/docs/advanced/platform/webhooks/+page.markdoc b/src/routes/docs/advanced/platform/webhooks/+page.markdoc
index d7fa9954f6f..3d7ab09d079 100644
--- a/src/routes/docs/advanced/platform/webhooks/+page.markdoc
+++ b/src/routes/docs/advanced/platform/webhooks/+page.markdoc
@@ -4,4 +4,62 @@ title: Webhooks
 description: Placeholder SEO.
 ---
 
-temp
\ No newline at end of file
+Certainly! Below is the content converted to Markdown format:
+
+```markdown
+```php
+<?php
+
+$events = $this->getParam('events', []);
+
+?>
+```
+
+Webhooks allow you to build or set up integrations which subscribe to certain events on Appwrite. When one of those events is triggered, we'll send an HTTP POST payload to the webhook's configured URL. Webhooks can be used to purge cache from CDN, calculate data or send a Slack notification. You're only limited by your imagination.
+
+## Add your webhook {% #addWebhook %}
+
+You can set your webhook by adding it from your Appwrite project dashboard. You can access your webhooks settings from your project dashboard or on the left navigation panel. Click the 'Add Webhook' button and choose your webhook name and the events that should trigger it. You can also set an optional basic HTTP authentication username and password to protect your endpoint from unauthorized access.
+
+## Payload {% #payload %}
+
+Each event type has a specific payload format with the relevant event information. All event payloads mirror the payloads for the API payload which parallel to the [event types](/docs/events).
+
+## Headers {% #headers %}
+
+HTTP requests made to your webhook's configured URL endpoint will contain several special headers.
+
+| Header | Description |
+|--------|-------------|
+| X-Appwrite-Webhook-Id | The ID of the Webhook who triggered the event. |
+| X-Appwrite-Webhook-Events | Names of the events that triggered this delivery. |
+| X-Appwrite-Webhook-Name | Name of the webhook as specified in your app settings and [events list](/docs/events). |
+| X-Appwrite-Webhook-User-Id | The user ID of the user who triggered the event. Returns an empty string if an API key triggered the event. Note that events like `account.create` or `account.sessions.create` are performed by guest users and will not return any user ID. If you still need the user ID for these events, you can find it in the event payload. |
+| X-Appwrite-Webhook-Project-Id | The ID of the project who owns the Webhook and API call. |
+| X-Appwrite-Webhook-Signature | The HMAC-SHA1 signature of the payload. This is used to verify the authenticity of the payload. |
+| User-Agent | Each request made by Appwrite will be 'Appwrite-Server'. |
+
+## Verification {% #verification %}
+
+Webhooks can be verified by using the [X-Appwrite-Webhook-Signature](/docs/webhooks#headers) header. 
+This is the HMAC-SHA1 signature of the payload. You can find the signature key in your webhooks properties in the dashboard. 
+To generate this hash you append the payload to the end of webhook URL (make sure there are no spaces in between) and then use the HMAC-SHA1 algorithm to generate the signature. 
+After you've generated the signature, compare it to the `X-Appwrite-Webhook-Signature` header value. 
+If they match, the payload is valid and you can trust it came from your Appwrite instance.
+
+
+## Events {% events %}
+
+Appwrite has events that fire when a resource changes.
+These events cover all Appwrite resources and can reflect create, update, and delete actions. 
+You can specify one or many events to subscribe to with webhooks.
+
+{% partial file="auth-events.md" /%}
+
+{% partial file="databases-events.md" /%}
+
+{% partial file="storage-events.md" /%}
+
+{% partial file="functions-events.md" /%}
+
+[Learn more about events](/docs/platform/api-keys)
diff --git a/src/routes/docs/advanced/self-hosting/+layout.svelte b/src/routes/docs/advanced/self-hosting/+layout.svelte
index 790d0a3c5bd..63a2f8f4900 100644
--- a/src/routes/docs/advanced/self-hosting/+layout.svelte
+++ b/src/routes/docs/advanced/self-hosting/+layout.svelte
@@ -29,11 +29,11 @@
 					href: '/docs/advanced/self-hosting/update'
 				},
 				{
-					label: 'Debug',
+					label: 'Debugging',
 					href: '/docs/advanced/self-hosting/debug'
 				},
 				{
-					label: 'E-Mail',
+					label: 'Email delivery',
 					href: '/docs/advanced/self-hosting/email'
 				},
 				{
@@ -45,7 +45,7 @@
 					href: '/docs/advanced/self-hosting/production'
 				},
 				{
-					label: 'SMS',
+					label: 'SMS delivery',
 					href: '/docs/advanced/self-hosting/sms'
 				},
 				{
diff --git a/src/routes/docs/products/databases/documents/+page.markdoc b/src/routes/docs/products/databases/documents/+page.markdoc
index 1fc0514f0c9..5c738ca2c94 100644
--- a/src/routes/docs/products/databases/documents/+page.markdoc
+++ b/src/routes/docs/products/databases/documents/+page.markdoc
@@ -1,14 +1,12 @@
 ---
 layout: article
-title: Document
+title: Documents
 description: This is the description used for SEO.
-difficulty: beginner
-readtime: 10
 ---
 Each piece of data or information in Appwrite Databases is a document.
 Documents have a structure defined by the parent collection.
 
-## Create documents {% #create %}
+## Create documents {% #create-documents %}
 {% info title="Permissions required" %}
 You must grant **create** permissions to users at the **collection level** before users can create documents.
 [Learn more about permissions](#permissions)
@@ -130,7 +128,7 @@ mutation {
 During testing, you might prefer to create documents in the Appwrite Console.
 To do so, navigate to the **Documents** tab of your collection and click the **Add document** button.
 
-## Retrieving documents {% #retrieve %}
+## List documents {% #list-documents %}
 
 {% info title="Permissions required" %}
 You must grant **read** permissions to users at the **collection level** before users can read documents.
diff --git a/src/routes/docs/products/databases/quick-start/+page.markdoc b/src/routes/docs/products/databases/quick-start/+page.markdoc
index f711f74d159..8f337a6b708 100644
--- a/src/routes/docs/products/databases/quick-start/+page.markdoc
+++ b/src/routes/docs/products/databases/quick-start/+page.markdoc
@@ -139,7 +139,7 @@ The response should look similar to this.
 
 {% /section %}
 
-{% section #query-documents step=4 title="Retrieve documents" %}
+{% section #list-documents step=4 title="List documents" %}
 To read and query data from your collection, use the `listDocuments` endpoint.
 
 Like the previous step, replace `<PROJECT_ID>`, `<DATABASE_ID>`, and`<COLLECTION_ID>` with their respective IDs.
diff --git a/src/routes/docs/products/functions/runtimes/+page.markdoc b/src/routes/docs/products/functions/runtimes/+page.markdoc
index 9cca7b09c05..e9090d32fda 100644
--- a/src/routes/docs/products/functions/runtimes/+page.markdoc
+++ b/src/routes/docs/products/functions/runtimes/+page.markdoc
@@ -10,12 +10,13 @@ Appwrite Functions supports an extensive list of runtimes to meet your unique te
 Below is a list of available Functions runtimes. The Appwrite team continually adds support for new runtimes.
 
 {% table %}
-* 
+* &nbsp; {% width=40 %}
 * Name
 * Versions
 * Architectures
 ---
-* x
+* {% only_dark %}![Node.js logo](/images/platforms/dark/nodejs.svg){% /only_dark %}
+{% only_light %}![Node.js logo](/images/platforms/nodejs.svg){% /only_light %}
 * [Node.js](https://hub.docker.com/r/openruntimes/node/tags)
 * `node-14.5`
 `node-16.0`
@@ -24,21 +25,24 @@ Below is a list of available Functions runtimes. The Appwrite team continually a
 `node-20.0`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![PHP logo](/images/platforms/dark/php.svg){% /only_dark %}
+{% only_light %}![PHP logo](/images/platforms/php.svg){% /only_light %}
 * [PHP](https://hub.docker.com/r/openruntimes/php/tags)
 * `php-8.0`
 `php-8.1`
 `php-8.2`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![Ruby logo](/images/platforms/dark/ruby.svg){% /only_dark %}
+{% only_light %}![Ruby logo](/images/platforms/ruby.svg){% /only_light %}
 * [Ruby](https://hub.docker.com/r/openruntimes/ruby/tags)
 * `ruby-3.0`
 `ruby-3.1`
 `ruby-3.2`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![Python logo](/images/platforms/dark/python.svg){% /only_dark %}
+{% only_light %}![Python logo](/images/platforms/python.svg){% /only_light %}
 * [Python](https://hub.docker.com/r/openruntimes/python/tags)
 * `python-3.8` 
 `python-3.9`
@@ -46,14 +50,16 @@ Below is a list of available Functions runtimes. The Appwrite team continually a
 `python-3.11`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![Deno logo](/images/platforms/dark/deno.svg){% /only_dark %}
+{% only_light %}![Deno logo](/images/platforms/deno.svg){% /only_light %}
 * [Deno](https://hub.docker.com/r/openruntimes/deno/tags)
 * `deno-1.21`
 `deno-1.24`
 `deno-1.35`
 * x86
 ---
-* x
+* {% only_dark %}![Dart logo](/images/platforms/dark/dart.svg){% /only_dark %}
+{% only_light %}![Dart logo](/images/platforms/dart.svg){% /only_light %}
 * [Dart](https://hub.docker.com/r/openruntimes/dart/tags)
 * `dart-2.15`
 `dart-2.16`
@@ -62,14 +68,16 @@ Below is a list of available Functions runtimes. The Appwrite team continually a
 `dart-3.0`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![.NET logo](/images/platforms/dark/dotnet.svg){% /only_dark %}
+{% only_light %}![.NET logo](/images/platforms/dotnet.svg){% /only_light %}
 * [.NET](https://hub.docker.com/r/openruntimes/dotnet/tags)
 * `dotnet-3.1` 
 `dotnet-6.0`
 `dotnet-7.0`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![Java logo](/images/platforms/dark/java.svg){% /only_dark %}
+{% only_light %}![Java logo](/images/platforms/java.svg){% /only_light %}
 * [Java](https://hub.docker.com/r/openruntimes/java/tags)
 * `java-8.0`
 `java-11.0`
@@ -77,25 +85,29 @@ Below is a list of available Functions runtimes. The Appwrite team continually a
 `java-18.0`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![Swift logo](/images/platforms/dark/swift.svg){% /only_dark %}
+{% only_light %}![Swift logo](/images/platforms/swift.svg){% /only_light %}
 * [Swift](https://hub.docker.com/r/openruntimes/swift/tags)
 * `swift-5.5`
 `swift-5.8`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![Kotlin logo](/images/platforms/dark/kotlin.svg){% /only_dark %}
+{% only_light %}![Kotlin logo](/images/platforms/kotlin.svg){% /only_light %}
 * [Kotlin](https://hub.docker.com/r/openruntimes/kotlin/tags)
 * `kotlin-1.6`
 `kotlin-1.8`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![C++ logo](/images/platforms/dark/c.svg){% /only_dark %}
+{% only_light %}![C++ logo](/images/platforms/c.svg){% /only_light %}
 * [C++](https://hub.docker.com/r/openruntimes/cpp/tags)
 * `cpp-17`
 `cpp-20`
 * x86 / arm64 / armv7 / armv8
 ---
-* x
+* {% only_dark %}![Bun logo](/images/platforms/dark/bun.svg){% /only_dark %}
+{% only_light %}![Bun logo](/images/platforms/bun.svg){% /only_light %}
 * [Bun](https://hub.docker.com/r/openruntimes/bun/tags)
 * `bun-1.0`
 * x86 / arm64
diff --git a/src/routes/docs/sdks/+page.markdoc b/src/routes/docs/sdks/+page.markdoc
index 217ad1ba571..017fc83b7c3 100644
--- a/src/routes/docs/sdks/+page.markdoc
+++ b/src/routes/docs/sdks/+page.markdoc
@@ -13,25 +13,34 @@ We're always working on improving and extending the current stack of available p
 Client libraries for integrating with Appwrite to build client-based applications and websites. Read one of the many [quick starts](/docs/quick-starts) guides for your framework of choice to start building your first application.
 
 {% table %}
-* x {% width=48 %}
+* &nbsp; {% width=40 %}
 * Platform
 * GitHub Repository
+* &nbsp; {% width=60 %}
 ---
-* x
+* {% only_dark %}![Javascript logo](/images/platforms/dark/javascript.svg){% /only_dark %}
+{% only_light %}![Javascript logo](/images/platforms/javascript.svg){% /only_light %}
 * Web SDK `13.0.0`
 * [appwrite/sdk-for-web](https://github.com/appwrite/sdk-for-web)
+* 
 ---
-* ![Flutter](https://appwrite.io/images-ee/platforms/flutter.svg)
+* {% only_dark %}![Flutter logo](/images/platforms/dark/flutter.svg){% /only_dark %}
+{% only_light %}![Flutter logo](/images/platforms/flutter.svg){% /only_light %}
 * Flutter SDK `11.0.0`
 * [appwrite/sdk-for-flutter](https://github.com/appwrite/sdk-for-flutter)
+* 
 ---
-* x
+* {% only_dark %}![Apple logo](/images/platforms/dark/apple.svg){% /only_dark %}
+{% only_light %}![Apple logo](/images/platforms/apple.svg){% /only_light %}
 * Apple SDK `4.0.0`
 * [appwrite/sdk-for-apple](https://github.com/appwrite/sdk-for-apple)
+* 
 ---
-* x
+* {% only_dark %}![Android logo](/images/platforms/dark/android.svg){% /only_dark %}
+{% only_light %}![Android logo](/images/platforms/android.svg){% /only_light %}
 * Android SDK `4.0.0`
 * [appwrite/sdk-for-android](https://github.com/appwrite/sdk-for-android)
+* 
 {% /table %}
 
 ## Server Side {% #server-side %}
@@ -39,45 +48,64 @@ Client libraries for integrating with Appwrite to build client-based application
 Server libraries for integrating with Appwrite to build server side integrations or use inside your [Appwrite Functions](/docs/products/functions). Read one of the many [quick starts](/docs/quick-starts) guides for your language/runtime of choice to start building your first server integration.
 
 {% table %}
-* x {% align="center" %}
+* &nbsp; {% width=40 %}
 * Platform
-* GitHub Repository {% width=10 %}
+* GitHub Repository
+* &nbsp; {% width=60 %}
 ---
-* x {% align="center" %}
+* {% only_dark %}![Node.js logo](/images/platforms/dark/nodejs.svg){% /only_dark %}
+{% only_light %}![Node.js logo](/images/platforms/nodejs.svg){% /only_light %}
 * Node.js SDK `11.0.0`
 * [appwrite/sdk-for-node](https://github.com/appwrite/sdk-for-node)
+* 
 ---
-* x {% align="center" %}
+* {% only_dark %}![Dart logo](/images/platforms/dark/dart.svg){% /only_dark %}
+{% only_light %}![Dart logo](/images/platforms/dart.svg){% /only_light %}
 * Dart SDK `10.0.0`
 * [appwrite/sdk-for-dart](https://github.com/appwrite/sdk-for-dart)
+* 
 ---
-* x {% align="center" %}
+* {% only_dark %}![Python logo](/images/platforms/dark/python.svg){% /only_dark %}
+{% only_light %}![Python logo](/images/platforms/python.svg){% /only_light %}
 * Python SDK `4.0.0`
 * [appwrite/sdk-for-python](https://github.com/appwrite/sdk-for-python)
+* 
 ---
-* x {% align="center" %}
+* {% only_dark %}![PHP logo](/images/platforms/dark/php.svg){% /only_dark %}
+{% only_light %}![PHP logo](/images/platforms/php.svg){% /only_light %}
 * PHP SDK `10.0.0`
 * [appwrite/sdk-for-php](https://github.com/appwrite/sdk-for-php)
+* 
 ---
-* x {% align="center" %}
+* {% only_dark %}![Ruby logo](/images/platforms/dark/ruby.svg){% /only_dark %}
+{% only_light %}![Ruby logo](/images/platforms/ruby.svg){% /only_light %}
 * Ruby SDK `10.0.0`
 * [appwrite/sdk-for-ruby](https://github.com/appwrite/sdk-for-ruby)
+* 
 ---
-* x {% align="center" %}
+* {% only_dark %}![.NET logo](/images/platforms/dark/dotnet.svg){% /only_dark %}
+{% only_light %}![.NET logo](/images/platforms/dotnet.svg){% /only_light %}
 * .NET SDK `0.6.0`
 * [appwrite/sdk-for-dotnet](https://github.com/appwrite/sdk-for-dotnet)
+* `beta`
 ---
-* x {% align="center" %}
+* {% only_dark %}![Deno logo](/images/platforms/dark/deno.svg){% /only_dark %}
+{% only_light %}![Deno logo](/images/platforms/deno.svg){% /only_light %}
 * Deno SDK `9.0.0`
 * [appwrite/sdk-for-deno](https://github.com/appwrite/sdk-for-deno)
+* 
 ---
-* x {% align="center" %}
+* {% only_dark %}![Kotlin logo](/images/platforms/dark/kotlin.svg){% /only_dark %}
+{% only_light %}![Kotlin logo](/images/platforms/kotlin.svg){% /only_light %}
 * Kotlin SDK `4.0.0`
 * [appwrite/sdk-for-kotlin](https://github.com/appwrite/sdk-for-kotlin)
+* 
 ---
-* x {% align="center" %}
+* {% only_dark %}![Swift logo](/images/platforms/dark/swift.svg){% /only_dark %}
+{% only_light %}![Swift logo](/images/platforms/swift.svg){% /only_light %}
 * Swift SDK `4.0.0`
 * [appwrite/sdk-for-swift](https://github.com/appwrite/sdk-for-swift)
+* 
 {% /table %}
 
 If you would like to help us extend our platforms and SDKs stack, you are more than welcome to contact us or check out our Appwrite SDK Generator project GitHub repository and read our contribution guide.
diff --git a/src/routes/docs/tooling/command-line/+layout.svelte b/src/routes/docs/tooling/command-line/+layout.svelte
index f0ac92a2342..08bfe1e3c3c 100644
--- a/src/routes/docs/tooling/command-line/+layout.svelte
+++ b/src/routes/docs/tooling/command-line/+layout.svelte
@@ -8,15 +8,6 @@
 	};
 
 	const navigation: NavTree = [
-		{
-			label: 'Getting started',
-			items: [
-				{
-					label: 'Overview',
-					href: '/docs/tooling/command-line'
-				}
-			]
-		},
 		{
 			label: 'Guides',
 			items: [
@@ -24,9 +15,17 @@
 					label: 'Installation',
 					href: '/docs/tooling/command-line/installation'
 				},
+				{
+					label: 'Commands',
+					href: '/docs/tooling/command-line/commands'
+				},
 				{
 					label: 'Deployment',
 					href: '/docs/tooling/command-line/deployment'
+				},
+				{
+					label: 'Non interactive',
+					href: '/docs/tooling/command-line/non-interactive'
 				}
 			]
 		}
diff --git a/src/routes/docs/tooling/command-line/+page.markdoc b/src/routes/docs/tooling/command-line/+page.markdoc
deleted file mode 100644
index 08ca136664e..00000000000
--- a/src/routes/docs/tooling/command-line/+page.markdoc
+++ /dev/null
@@ -1,9 +0,0 @@
----
-layout: article
-title: CLI
-description: lorem ipsum
-difficulty: beginner
-readtime: 5
----
-
-If you're looking to migrate existing projects to Appwrite, Migrations can help you make the move more quickly. You can move your app from Firebase, Supabase, Nhost, and even move between self-hosted and Cloud projects using Migrations. You can also use Migrations to move between two self-hosted instances or even to duplicate projects on the same instance. Migrations will automatically move accounts, database documents, and storage files from one source to another.
diff --git a/src/routes/docs/tooling/command-line/commands/+page.markdoc b/src/routes/docs/tooling/command-line/commands/+page.markdoc
new file mode 100644
index 00000000000..08053554b2b
--- /dev/null
+++ b/src/routes/docs/tooling/command-line/commands/+page.markdoc
@@ -0,0 +1,126 @@
+---
+layout: article
+title: Commands
+description: 
+---
+
+Other than commands to create and deploy databases, collections, functions, teams, and buckets, the Appwrite CLI can be used as a Server SDK as well. The Appwrite CLI has a command for every Server API endpoint.
+
+Commands follows the following general syntax:
+
+```sh
+appwrite [COMMAND] --[OPTIONS]
+```
+
+## List {% #list %}
+
+Below is a list of the available commands in the Appwrite CLI. You can get more information on each command by running `appwrite [COMMAND] --help`.
+
+{% table %}
+* Command
+* Description
+---
+* `login`
+* The login command allows you to authenticate into the CLI. This command expects the console account that you use to log into the Appwrite Console.
+---
+* `client`
+* The client command allows you to configure your CLI.
+---
+* `init`
+* The init command helps you initialize your Appwrite project, databases, collections, functions, teams, and buckets.
+---
+* `deploy`
+* The deploy command provides a convenient wrapper for deploying your databases, collections, functions, teams, and buckets.
+---
+* `logout`
+* The logout command allows you to logout from the CLI.
+---
+* `projects`
+* The projects command allows you to view, create, and manage your Appwrite projects.
+---
+* `storage`
+* The storage command allows you to manage your project files.
+---
+* `teams`
+* The teams command allows you to group users of your project and to enable them to share access permissions to your project's resources.
+---
+* `users`
+* The users command allows you to manage your project users.
+---
+* `account`
+* The account command allows you to authenticate as and manage a user account.
+---
+* `avatars`
+* The avatars command provides utilities to manage images, icons, and avatars.
+---
+* `functions`
+* The functions command allows you view, create and manage your Appwrite Functions.
+---
+* `databases`
+* The databases command allows you to create structured collections of documents, query and filter lists of documents.
+---
+* `locale`
+* The locale command allows you to customize your app based on your users' location.
+---
+
+{% /table %}
+
+## Verbose {% #verbose %}
+In case of errors with any command, you can get more information about what went wrong using the `--verbose` flag
+
+```sh
+appwrite users list --verbose
+```
+
+## Examples {% #examples %}
+
+### Create user
+
+To create a new user in your project, you can use the create command.
+
+```sh
+appwrite users create --userId "unique()" \
+    --email hello@appwrite.io \
+    --password very_strong_password
+```
+
+### List Users
+
+To get a list of all your project users, you can use the list command.
+
+```sh
+appwrite users list
+```
+
+### List collections
+
+To get a list of all your collections, you can use the listCollections command.
+
+```sh
+appwrite databases listCollections --databaseId [DATABASE_ID]
+```
+
+If you wish to parse the output from the CLI, you can request the CLI output in JSON format using the `--json` flag
+
+```sh
+appwrite databases listCollections --databaseId [DATABASE_ID]--json
+```
+
+### Get collection
+
+To get more information on a particular collection, you can make use of the getCollection command and pass in the collectionId.
+
+```sh
+appwrite databases getCollection --databaseId [DATABASE_ID] --collectionId [COLLECTION_ID]
+```
+
+### Create document
+
+To create a new document in an existing collection, use the `createDocument` command.
+
+```sh
+appwrite databases createDocument \
+    --databaseId [DATABASE_ID] --collectionId [COLLECTION_ID] \
+    --documentId 'unique()' --data '{ "Name": "Iron Man" }' \
+    --permissions 'read("any")' 'write("team:abc")' 
+```
\ No newline at end of file
diff --git a/src/routes/docs/tooling/command-line/deployment/+page.markdoc b/src/routes/docs/tooling/command-line/deployment/+page.markdoc
index 71c22a4b996..8f5a7b27e08 100644
--- a/src/routes/docs/tooling/command-line/deployment/+page.markdoc
+++ b/src/routes/docs/tooling/command-line/deployment/+page.markdoc
@@ -3,9 +3,10 @@ layout: article
 title: Deployment
 description: 
 ---
+
 The Apprite CLI allows you to create and deploy databases, collections, buckets, teams and functions to your Appwrite project from a configuration file. This is especially helpful if you're trying to track project setup using version control.
 
-# Initialization {% #initialization %}
+## Initialization {% #initialization %}
 
 After you're logged in, the CLI needs to be initialized with your Appwrite project. You can initialize the CLI using:
 
@@ -13,7 +14,7 @@ After you're logged in, the CLI needs to be initialized with your Appwrite proje
 appwrite init project
 ```
 
-The following prompts will guide you through the setup process. The init command also creates an `appwrite.json` file representing your Appwrite project.
+The following prompts will guide you through the setup process. The init command also creates an [appwrite.json](/docs/command-line-deployment#appwriteJSON) file representing your Appwrite project.
 
 You can fetch all the existing databases and collections in your current project using:
 
@@ -21,3 +22,142 @@ You can fetch all the existing databases and collections in your current project
 appwrite init collection
 ```
 
+You can fetch all the existing teams in your current project using:
+
+```sh
+appwrite init team
+```
+
+## Deploying Functions {% #deploying-function %}
+
+The CLI also handles the creation and deployment of Appwrite Functions. Run this command in the folder holding your `appwrite.json` file.
+
+```sh
+appwrite init function
+? What would you like to name your function? My Awesome Function
+? What runtime would you like to use? Node.js (node-15.5)
+✓ Success
+```
+
+This command creates a new function **My Awesome Function** in your current Appwrite project and also creates a template function for you to get started.
+
+You can now deploy this function by running this command in the folder holding your `appwrite.json` file.
+
+```sh
+appwrite deploy function
+? Which functions would you like to deploy? Awesome Function (621229798628cf5bf712)
+ℹ Info Deploying function Awesome Function ( 621229798628cf5bf712 )
+✓ Success Deployed Awesome Function ( 621229798628cf5bf712 )
+```
+
+## Deploying Collections {% #deploying-collections %}
+
+The Appwrite CLI also helps you deploy your project's databases and collections schema from one project to another.
+
+You can deploy all the databases and collections in your [appwrite.json](#) file by running this command in the folder holding your `appwrite.json` file.
+
+The deploy command will overwrite existing collections causing existing data to be lost. If you already have data in your project, you will need to write your own migration script using a Server SDK instead of using the CLI.
+
+```sh
+appwrite deploy collection
+```
+
+## Deploying Teams {% #deploying-teams %}
+
+The Appwrite CLI can create teams to organize users. Teams can be used to grant access permissions to a group of users. [Learn more about permissions](/docs/permissions#permission-roles).
+
+Deploy teams by running this command in the folder holding your `appwrite.json` file.
+
+```sh
+appwrite deploy team
+```
+
+## Deploying Storage {% #deploying-storage %}
+
+The Appwrite CLI allows you to configure and deploy buckets across projects. All the bucket's settings are available through the [appwrite.json](/docs/command-line-deployment#appwriteJSON) file.
+
+Deploy storage buckets by running this command in the folder holding your `appwrite.json` file.
+
+```sh
+appwrite deploy bucket
+```
+
+## Conflicts {% #conflicts %}
+
+When using `appwrite.json`, changes made in the Appwrite Console can cause conflicts with the local config. To avoid conflicts, prefer updating configuration locally and deploying instead of using the console.
+
+## The appwrite.json file {% #appwrite-json %}
+
+An `appwrite.json` file is created by the CLI when you initialize your project. It stores all the configuration for the CLI to be able to interact with your Appwrite project in JSON format. When using the `appwrite deploy` command, the CLI uses information from `appwrite.json` to deploy your functions and collections.
+
+### Configuration {% #configuration %}
+
+Here's a complete list of all configurable options in `appwrite.json`:
+
+| Option | Type | Description |
+| --- | --- | --- |
+| `projectId` | string | ID of your Appwrite Project. |
+| `projectName` | string | Name of your Appwrite Project. |
+| `functions` | array of [functions](/docs/command-line-deployment#function-options) | Configuration of functions in your project. |
+| `databases` | array of [databases](/docs/command-line-deployment#databases-options) | Configuration of databases in your project. |
+| `collections` | array of [collections](/docs/command-line-deployment#collection-options) | Configuration of collections in your project. |
+| `teams` | array of [teams](/docs/command-line-deployment#teams-options) | Configuration of teams in your project. |
+| `buckets` | array of [buckets](/docs/command-line-deployment#buckets-options) | Configuration of teams in your project. |
+
+#### Function options
+
+| Option | Type | Description |
+| --- | --- | --- |
+| `$id` | string | Function ID. |
+| `name` | string | Function Name. |
+| `runtime` | string | Function runtime, must be enabled. [Learn more about runtimes](/docs/functions#supportedRuntimes). |
+| `path` | string | Path to folder containing the function's source code. |
+| `entrypoint` | string | Entry point of the function relative to the folder specified in path. |
+| `ignore` | array of strings | Files to ignore inside the function. [Learn more about ignoring files](/docs/functions#ignoreFiles). |
+| `execute` | array of strings | Grants execute permissions to users. [Learn more about role strings](/docs/rest#permissions). |
+| `events` | array of strings | Events that trigger the function to execute. [Learn more about events](/docs/events). |
+| `schedule` | string | Execute schedule for the function. [Learn more about scheduled executions](/docs/functions#scheduled-execution). |
+| `timeout` | int | Execution timeout of the function in seconds, with a maximum configurable limit of 900 seconds. |
+| `variables` | JSON object | Variables provided to the function on execution stored as a key-value JSON object. |
+
+#### Databases options
+
+| Option | Type | Description |
+| --- | --- | --- |
+| `$id` | string | Database ID. |
+| `name` | string | Database Name. |
+
+#### Collection options
+
+| Option | Type | Description |
+| --- | --- | --- |
+| `$id` | string | Collection ID. |
+| `name` | string | Collection Name. |
+| `databaseId` | string | ID of the database to which this collection belongs. |
+| `enabled` | bool | If the collection is enabled. |
+| `documentSecurity` | bool | If access permissions can be defined at the document level. |
+| `$permissions` | array of strings | Grants access permissions to users at the collection level. [Learn more about permissions](/docs/rest#permissions). |
+| `attributes` | array of objects | Defines a list of attributes in the collection. [Learn more about the Attributes List Object](/docs/models/attributeList). |
+| `indexes` | array of objects | Defines a list of indexes in the collection. [Learn more about the Indexes List Object](/docs/models/indexList). |
+
+#### Buckets options
+
+| Option | Type | Description |
+| --- | --- | --- |
+| `$id` | string | Bucket ID. |
+| `name` | string | Bucket Name. |
+| `$permissions` | array of strings | Grants access permissions to users at the bucket level. [Learn more about permissions](/docs/rest#permissions). |
+| `fileSecurity` | boolean | Whether file-level security is enabled. [Learn more about permissions](/docs/rest#permissions). |
+| `enabled` | boolean | Whether the bucket is enabled or disabled. |
+| `maximumFileSize` | integer | Maximum file size supported. |
+| `allowedFileExtensions` | string\[\] | List of allowed file extensions. |
+| `compression` | string | Preferred algorithm for compression. Will be one of `none`, `gzip`, or `zstd`. |
+| `encryption` | boolean | Whether the bucket's content is encrypted. |
+| `antivirus` | boolean | Whether virus scanning is enabled for the bucket's content. |
+
+#### Teams options
+
+| Option | Type | Description |
+| --- | --- | --- |
+| `$id` | string | Team ID. |
+| `name` | string | Team Name. |
\ No newline at end of file
diff --git a/src/routes/docs/tooling/command-line/non-interactive/+page.markdoc b/src/routes/docs/tooling/command-line/non-interactive/+page.markdoc
new file mode 100644
index 00000000000..6338b1bdb87
--- /dev/null
+++ b/src/routes/docs/tooling/command-line/non-interactive/+page.markdoc
@@ -0,0 +1,57 @@
+---
+layout: article
+title: Non interactive
+description: 
+---
+The Appwrite CLI can be used in a non-interactive and headless manner, without saving configuration or sessions. This is especially useful when you want to automate tasks on a continuous integration server. You can enable the non-interactive mode for the Appwrite CLI by setting the `project ID`, `endpoint`, and `API Key`:
+
+```sh
+appwrite client \
+    --endpoint https://cloud.appwrite.io/v1 \
+    --projectId [YOUR_PROJECT_ID] \
+    --key YOUR_API_KEY
+```
+
+When you set the global configuration parameters using the `appwrite client` command, they take precedence over the local configuration parameters in your `appwrite.json` thereby switching the CLI to non-interactive mode.
+
+In this mode, the CLI can only interact with one project at a time.
+
+## API Keys {% #api-keys %}
+In non-interactive mode, the CLI uses an API key to authenticate. Your API key must have sufficient permissions to execute the commands you plan to use. [Learn more about API Keys](/docs/platform/api-keys).
+
+## Deployment {% #deployment %}
+Appwrite's deploy commands can also be executed in a non-interactive mode. This applies to both function and collection deployment.
+
+You can deploy a function non-interactively by using the `--yes` option to skip all warnings and specifying which functions you want to deploy.
+
+Deploy a single function by ID:
+
+```sh
+appwrite deploy function --functionId [FUNCTION ID] --yes
+```
+
+Deploy all functions:
+
+```sh
+appwrite deploy function --all --yes
+```
+
+You can deploy databases, collections, teams, and buckets non-interactively in a similar way by using the `--all` and `--yes` option.
+
+Deploy all databases and collections:
+
+```sh
+appwrite deploy collection --all --yes
+```
+
+Deploy all teams:
+
+```sh
+appwrite deploy team --all --yes
+```
+
+Deploy all buckets:
+
+```sh
+appwrite deploy buckets --all --yes
+```
\ No newline at end of file
diff --git a/static/images/platforms/dark/android.svg b/static/images/platforms/dark/android.svg
new file mode 100644
index 00000000000..1f94ee587e6
--- /dev/null
+++ b/static/images/platforms/dark/android.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M21.005 43.003c-4.053-.002-7.338 3.291-7.339 7.341l.005 30.736a7.338 7.338 0 007.342 7.343 7.33 7.33 0 007.338-7.342V50.34a7.345 7.345 0 00-7.346-7.337m59.193-27.602l5.123-9.355a1.023 1.023 0 00-.401-1.388 1.022 1.022 0 00-1.382.407l-5.175 9.453c-4.354-1.938-9.227-3.024-14.383-3.019-5.142-.005-10.013 1.078-14.349 3.005L44.45 5.075a1.01 1.01 0 00-1.378-.406 1.007 1.007 0 00-.404 1.38l5.125 9.349c-10.07 5.193-16.874 15.083-16.868 26.438l66.118-.008c.002-11.351-6.79-21.221-16.845-26.427M48.942 29.858a2.772 2.772 0 01.003-5.545 2.78 2.78 0 012.775 2.774 2.776 2.776 0 01-2.778 2.771m30.106-.005a2.77 2.77 0 01-2.772-2.771 2.793 2.793 0 012.773-2.778 2.79 2.79 0 012.767 2.779 2.767 2.767 0 01-2.768 2.77M31.195 44.39l.011 47.635a7.822 7.822 0 007.832 7.831l5.333.002.006 16.264c-.001 4.05 3.291 7.342 7.335 7.342 4.056 0 7.342-3.295 7.343-7.347l-.004-16.26 9.909-.003.004 16.263c0 4.047 3.293 7.346 7.338 7.338 4.056.003 7.344-3.292 7.343-7.344l-.005-16.259 5.352-.004a7.835 7.835 0 007.836-7.834l-.009-47.635-65.624.011zm83.134 5.943a7.338 7.338 0 00-7.341-7.339c-4.053-.004-7.337 3.287-7.337 7.342l.006 30.738a7.334 7.334 0 007.339 7.339 7.337 7.337 0 007.338-7.343l-.005-30.737z" style="fill: rgb(255, 255, 255);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/angular.svg b/static/images/platforms/dark/angular.svg
new file mode 100644
index 00000000000..1e059f95a1b
--- /dev/null
+++ b/static/images/platforms/dark/angular.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M52.864 64h23.28l-12.375-25.877zM63.81 1.026l-59.257 20.854 9.363 77.637 49.957 27.457 50.214-27.828 9.36-77.635-59.637-20.485zm-15.766 73.974l-7.265 18.176-13.581.056 36.608-81.079-.07-.153h-.064l.001-.133.063.133h.14100000000000001l.123-.274v.274h-.124l-.069.153 38.189 81.417-13.074-.287-8.042-18.58-17.173.082" style="fill: rgb(255, 255, 255);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/apple.svg b/static/images/platforms/dark/apple.svg
new file mode 100644
index 00000000000..ffe48d68a64
--- /dev/null
+++ b/static/images/platforms/dark/apple.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M97.905 67.885c.174 18.8 16.494 25.057 16.674 25.137-.138.44-2.607 8.916-8.597 17.669-5.178 7.568-10.553 15.108-19.018 15.266-8.318.152-10.993-4.934-20.504-4.934-9.508 0-12.479 4.776-20.354 5.086-8.172.31-14.395-8.185-19.616-15.724C15.822 94.961 7.669 66.8 18.616 47.791c5.438-9.44 15.158-15.417 25.707-15.571 8.024-.153 15.598 5.398 20.503 5.398 4.902 0 14.106-6.676 23.782-5.696 4.051.169 15.421 1.636 22.722 12.324-.587.365-13.566 7.921-13.425 23.639M82.272 21.719c4.338-5.251 7.258-12.563 6.462-19.836-6.254.251-13.816 4.167-18.301 9.416-4.02 4.647-7.54 12.087-6.591 19.216 6.971.54 14.091-3.542 18.43-8.796" style="fill: rgb(255, 255, 255);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/bun.svg b/static/images/platforms/dark/bun.svg
new file mode 100644
index 00000000000..4b582900894
--- /dev/null
+++ b/static/images/platforms/dark/bun.svg
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="Bun" viewBox="0 0 80 70" xmlns="http://www.w3.org/2000/svg">
+  <title>Bun Logo</title>
+  <path id="Shadow" d="M71.09,20.74c-.16-.17-.33-.34-.5-.5s-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5-.33-.34-.5-.5A26.46,26.46,0,0,1,75.5,35.7c0,16.57-16.82,30.05-37.5,30.05-11.58,0-21.94-4.23-28.83-10.86l.5.5.5.5.5.5.5.5.5.5.5.5.5.5C19.55,65.3,30.14,69.75,42,69.75c20.68,0,37.5-13.48,37.5-30C79.5,32.69,76.46,26,71.09,20.74Z" style="fill: rgb(255, 255, 255);"/>
+  <g id="Body">
+    <path id="Light_Shine" data-name="Light Shine" d="M24.53,11.17C29,8.49,34.94,3.46,40.78,3.45A9.29,9.29,0,0,0,38,3c-2.42,0-5,1.25-8.25,3.13-1.13.66-2.3,1.39-3.54,2.15-2.33,1.44-5,3.07-8,4.7C8.69,18.13,3,26.62,3,35.7c0,.4,0,.8,0,1.19C9.06,15.48,20.07,13.85,24.53,11.17Z" style="fill: rgb(255, 255, 255);"/>
+    <path id="Top" d="M35.12,5.53A16.41,16.41,0,0,1,29.49,18c-.28.25-.06.73.3.59,3.37-1.31,7.92-5.23,6-13.14C35.71,5,35.12,5.12,35.12,5.53Zm2.27,0A16.24,16.24,0,0,1,39,19c-.12.35.31.65.55.36C41.74,16.56,43.65,11,37.93,5,37.64,4.74,37.19,5.14,37.39,5.49Zm2.76-.17A16.42,16.42,0,0,1,47,17.12a.33.33,0,0,0,.65.11c.92-3.49.4-9.44-7.17-12.53C40.08,4.54,39.82,5.08,40.15,5.32ZM21.69,15.76a16.94,16.94,0,0,0,10.47-9c.18-.36.75-.22.66.18-1.73,8-7.52,9.67-11.12,9.45C21.32,16.4,21.33,15.87,21.69,15.76Z" style="fill-rule: evenodd; fill: rgb(255, 255, 255);"/>
+    <path id="Outline" d="M38,65.75C17.32,65.75.5,52.27.5,35.7c0-10,6.18-19.33,16.53-24.92,3-1.6,5.57-3.21,7.86-4.62,1.26-.78,2.45-1.51,3.6-2.19C32,1.89,35,.5,38,.5s5.62,1.2,8.9,3.14c1,.57,2,1.19,3.07,1.87,2.49,1.54,5.3,3.28,9,5.27C69.32,16.37,75.5,25.69,75.5,35.7,75.5,52.27,58.68,65.75,38,65.75ZM38,3c-2.42,0-5,1.25-8.25,3.13-1.13.66-2.3,1.39-3.54,2.15-2.33,1.44-5,3.07-8,4.7C8.69,18.13,3,26.62,3,35.7,3,50.89,18.7,63.25,38,63.25S73,50.89,73,35.7C73,26.62,67.31,18.13,57.78,13,54,11,51.05,9.12,48.66,7.64c-1.09-.67-2.09-1.29-3-1.84C42.63,4,40.42,3,38,3Z" style="fill: rgb(255, 255, 255);"/>
+  </g>
+  <g id="Mouth">
+    <g id="Background-2" data-name="Background">
+      <path d="M45.05,43a8.93,8.93,0,0,1-2.92,4.71,6.81,6.81,0,0,1-4,1.88A6.84,6.84,0,0,1,34,47.71,8.93,8.93,0,0,1,31.12,43a.72.72,0,0,1,.8-.81H44.26A.72.72,0,0,1,45.05,43Z" style="fill: rgb(255, 255, 255);"/>
+    </g>
+    <g id="Tongue">
+      <path id="Background-3" data-name="Background" d="M34,47.79a6.91,6.91,0,0,0,4.12,1.9,6.91,6.91,0,0,0,4.11-1.9,10.63,10.63,0,0,0,1-1.07,6.83,6.83,0,0,0-4.9-2.31,6.15,6.15,0,0,0-5,2.78C33.56,47.4,33.76,47.6,34,47.79Z" style="fill: rgb(255, 255, 255);"/>
+      <path id="Outline-2" data-name="Outline" d="M34.16,47a5.36,5.36,0,0,1,4.19-2.08,6,6,0,0,1,4,1.69c.23-.25.45-.51.66-.77a7,7,0,0,0-4.71-1.93,6.36,6.36,0,0,0-4.89,2.36A9.53,9.53,0,0,0,34.16,47Z" style="fill: rgb(255, 255, 255);"/>
+    </g>
+    <path id="Outline-3" data-name="Outline" d="M38.09,50.19a7.42,7.42,0,0,1-4.45-2,9.52,9.52,0,0,1-3.11-5.05,1.2,1.2,0,0,1,.26-1,1.41,1.41,0,0,1,1.13-.51H44.26a1.44,1.44,0,0,1,1.13.51,1.19,1.19,0,0,1,.25,1h0a9.52,9.52,0,0,1-3.11,5.05A7.42,7.42,0,0,1,38.09,50.19Zm-6.17-7.4c-.16,0-.2.07-.21.09a8.29,8.29,0,0,0,2.73,4.37A6.23,6.23,0,0,0,38.09,49a6.28,6.28,0,0,0,3.65-1.73,8.3,8.3,0,0,0,2.72-4.37.21.21,0,0,0-.2-.09Z" style="fill: rgb(255, 255, 255);"/>
+  </g>
+  <g id="Face">
+    <ellipse id="Right_Blush" data-name="Right Blush" cx="53.22" cy="40.18" rx="5.85" ry="3.44" style="fill: rgb(255, 255, 255);"/>
+    <ellipse id="Left_Bluch" data-name="Left Bluch" cx="22.95" cy="40.18" rx="5.85" ry="3.44" style="fill: rgb(255, 255, 255);"/>
+    <path id="Eyes" d="M25.7,38.8a5.51,5.51,0,1,0-5.5-5.51A5.51,5.51,0,0,0,25.7,38.8Zm24.77,0A5.51,5.51,0,1,0,45,33.29,5.5,5.5,0,0,0,50.47,38.8Z" style="fill-rule: evenodd; fill: rgb(255, 255, 255);"/>
+    <path id="Iris" d="M24,33.64a2.07,2.07,0,1,0-2.06-2.07A2.07,2.07,0,0,0,24,33.64Zm24.77,0a2.07,2.07,0,1,0-2.06-2.07A2.07,2.07,0,0,0,48.75,33.64Z" style="fill-rule: evenodd; fill: rgb(255, 255, 255);"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/c.svg b/static/images/platforms/dark/c.svg
new file mode 100755
index 00000000000..3320c79e243
--- /dev/null
+++ b/static/images/platforms/dark/c.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <g>
+    <path d="M115.4 30.7l-48.3-27.8c-.8-.5-1.9-.7-3.1-.7-1.2 0-2.3.3-3.1.7l-48 27.9c-1.7 1-2.9 3.5-2.9 5.4v55.7c0 1.1.2 2.4 1 3.5l106.8-62c-.6-1.2-1.5-2.1-2.4-2.7z" style="fill: rgb(255, 255, 255);"/>
+    <path d="M10.7 95.3c.5.8 1.2 1.5 1.9 1.9l48.2 27.9c.8.5 1.9.7 3.1.7 1.2 0 2.3-.3 3.1-.7l48-27.9c1.7-1 2.9-3.5 2.9-5.4v-55.7c0-.9-.1-1.9-.6-2.8l-106.6 62z" style="fill: rgb(255, 255, 255);"/>
+    <path d="M85.3 76.1c-4.2 7.4-12.2 12.4-21.3 12.4-13.5 0-24.5-11-24.5-24.5s11-24.5 24.5-24.5c9.1 0 17.1 5 21.3 12.5l13-7.5c-6.8-11.9-19.6-20-34.3-20-21.8 0-39.5 17.7-39.5 39.5s17.7 39.5 39.5 39.5c14.6 0 27.4-8 34.2-19.8l-12.9-7.6z" style="fill: rgb(28, 33, 56);"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/csharp.svg b/static/images/platforms/dark/csharp.svg
new file mode 100644
index 00000000000..99235e30083
--- /dev/null
+++ b/static/images/platforms/dark/csharp.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><g><path fill="#9B4F96" d="M115.4 30.7l-48.3-27.8c-.8-.5-1.9-.7-3.1-.7-1.2 0-2.3.3-3.1.7l-48 27.9c-1.7 1-2.9 3.5-2.9 5.4v55.7c0 1.1.2 2.4 1 3.5l106.8-62c-.6-1.2-1.5-2.1-2.4-2.7z"/><path fill="#68217A" d="M10.7 95.3c.5.8 1.2 1.5 1.9 1.9l48.2 27.9c.8.5 1.9.7 3.1.7 1.2 0 2.3-.3 3.1-.7l48-27.9c1.7-1 2.9-3.5 2.9-5.4v-55.7c0-.9-.1-1.9-.6-2.8l-106.6 62z"/><path fill="#fff" d="M85.3 76.1c-4.2 7.4-12.2 12.4-21.3 12.4-13.5 0-24.5-11-24.5-24.5s11-24.5 24.5-24.5c9.1 0 17.1 5 21.3 12.5l13-7.5c-6.8-11.9-19.6-20-34.3-20-21.8 0-39.5 17.7-39.5 39.5s17.7 39.5 39.5 39.5c14.6 0 27.4-8 34.2-19.8l-12.9-7.6zM97 66.2l.9-4.3h-4.2v-4.7h5.1l1.2-6.2h4.9l-1.2 6.1h3.8l1.2-6.1h4.8l-1.2 6.1h2.4v4.7h-3.3l-.9 4.3h4.2v4.7h-5.1l-1.2 6h-4.9l1.2-6h-3.8l-1.2 6h-4.8l1.2-6h-2.4v-4.7h3.3zm4.8 0h3.8l.9-4.3h-3.8l-.9 4.3z"/></g></svg>
diff --git a/static/images/platforms/dark/dart.svg b/static/images/platforms/dark/dart.svg
new file mode 100644
index 00000000000..7cd9beb9749
--- /dev/null
+++ b/static/images/platforms/dark/dart.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <text transform="matrix(1, 0, 0, 1, 69.784261, 14.418589)" style="fill: rgb(28, 33, 56); font-family: Roboto; font-size: 36px; stroke: rgb(255, 255, 255); stroke-linecap: square; stroke-linejoin: round; stroke-width: 7px; white-space: pre;"/>
+  <path d="M 28.456 96.488 L 8.732 76.765 C 6.392 74.365 4.943 70.975 4.943 67.661 C 4.943 66.127 5.808 63.728 6.46 62.355 L 24.666 24.432 L 28.456 96.488 Z" style="stroke-linecap: square; stroke-linejoin: round; fill: rgb(28, 33, 56); stroke: rgb(255, 255, 255); stroke-width: 7px;"/>
+  <path d="M 95.968 28.222 L 76.244 8.498 C 74.523 6.769 70.937 4.709 67.904 4.709 C 65.293 4.709 62.734 5.234 61.08 6.226 L 24.676 24.432 L 95.968 28.222 Z" style="stroke-linecap: square; stroke-linejoin: round; fill: rgb(28, 33, 56); stroke: rgb(255, 255, 255); stroke-width: 7px;"/>
+  <polygon points="51.969 120.001 99.757 120.001 99.757 99.523 64.106 88.14 31.49 99.523" style="stroke-linecap: square; stroke-linejoin: round; fill: rgb(28, 33, 56); stroke: rgb(255, 255, 255); stroke-width: 7px;"/>
+  <path d="M 24.666 85.868 C 24.666 91.953 25.43 93.445 28.456 96.488 L 31.49 99.523 L 99.757 99.523 L 66.386 61.6 L 24.666 24.432 L 24.666 85.868 Z" style="stroke-linecap: square; stroke-linejoin: round; fill: rgb(28, 33, 56); stroke: rgb(255, 255, 255); stroke-width: 7px;"/>
+  <path d="M 85.347 24.424 L 24.666 24.424 L 99.757 99.515 L 120.235 99.515 L 120.235 52.489 L 95.959 28.214 C 92.552 24.797 89.527 24.424 85.347 24.424 Z" style="stroke-linecap: square; stroke-linejoin: round; fill: rgb(28, 33, 56); stroke: rgb(255, 255, 255); stroke-width: 7px;"/>
+  <path opacity="0.2" enable-background="new    " d="M 29.219 97.243 C 26.184 94.2 25.43 91.199 25.43 85.868 L 25.43 25.187 L 24.676 24.432 L 24.676 85.868 C 24.666 91.199 24.666 92.674 29.219 97.243 L 31.49 99.515 L 31.49 99.515 L 29.219 97.243 Z" style="stroke-linecap: square; stroke-linejoin: round; fill: rgb(28, 33, 56); stroke: rgb(255, 255, 255); stroke-width: 7px;"/>
+  <path opacity="0.2" enable-background="new    " d="M 95.968 28.222 C 92.205 24.458 89.127 24.432 84.593 24.432 L 24.676 24.432 L 25.43 25.187 L 84.593 25.187 C 86.856 25.187 92.569 24.806 95.968 28.222 L 95.968 28.222 Z" style="stroke-linecap: square; stroke-linejoin: round; fill: rgb(28, 33, 56); stroke: rgb(255, 255, 255); stroke-width: 7px;"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/deno.svg b/static/images/platforms/dark/deno.svg
new file mode 100644
index 00000000000..569634a89e2
--- /dev/null
+++ b/static/images/platforms/dark/deno.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="typescript" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <style>.cls-1{fill:#fff;}.cls-2{fill:#007acc;}</style>
+  </defs>
+  <title>Artboard 3</title>
+  <g transform="matrix(0.013781, 0, 0, -0.01394, -5.049645, 134.455688)" fill="#000000" stroke="none" style="">
+    <path d="M4720 9174 c-19 -2 -80 -9 -135 -14 -782 -82 -1552 -413 -2180 -939 -116 -96 -380 -360 -476 -476 -520 -621 -824 -1318 -936 -2143 -25 -183 -25 -801 0 -984 112 -825 416 -1522 936 -2143 96 -116 360 -380 476 -476 621 -520 1318 -824 2143 -936 183 -25 801 -25 984 0 825 112 1522 416 2143 936 116 96 380 360 476 476 520 621 824 1318 936 2143 25 183 25 801 0 984 -112 825 -416 1522 -936 2143 -96 116 -360 380 -476 476 -619 518 -1323 826 -2137 935 -88 12 -216 17 -453 19 -181 2 -346 1 -365 -1z m50 -432 c0 -117 8 -371 19 -612 6 -118 13 -287 16 -375 11 -312 44 -1131 49 -1204 l5 -73 -45 5 c-25 2 -48 8 -52 11 -3 4 -10 73 -14 154 -18 356 -77 1737 -83 1939 l-6 222 28 4 c15 2 40 5 56 6 l27 1 0 -78z m957 24 c1 -1 4 -303 7 -671 4 -369 9 -700 12 -736 3 -37 2 -69 -3 -71 -4 -3 -29 -3 -54 0 l-46 4 -7 291 c-4 161 -9 339 -11 397 -8 177 -15 778 -9 793 4 11 15 12 57 5 29 -6 53 -11 54 -12z m-2313 -335 c6 -9 53 -560 111 -1281 19 -245 38 -469 41 -497 5 -51 4 -53 -28 -73 -18 -11 -36 -20 -40 -20 -3 0 -9 26 -12 58 -14 130 -68 758 -106 1212 -22 267 -42 506 -45 532 -5 44 -4 48 22 62 32 17 50 20 57 7z m2753 -201 c28 -10 31 -15 37 -72 10 -100 7 -578 -4 -578 -29 0 -89 34 -94 53 -3 12 -6 154 -6 315 0 325 -4 306 67 282z m-1847 -47 c0 -27 7 -176 15 -333 8 -157 17 -356 21 -442 7 -174 9 -168 -58 -172 -33 -1 -33 -1 -35 49 -2 28 -7 115 -13 195 -5 80 -17 253 -25 385 -8 132 -18 263 -21 291 -6 50 -5 52 22 62 16 6 44 11 62 11 32 1 32 1 32 -46z m2774 -137 l34 -14 7 -134 c3 -73 5 -231 3 -350 l-3 -218 -42 21 -42 20 -3 332 c-2 183 -1 338 1 345 4 15 4 15 45 -2z m-1826 -131 c6 -6 20 -491 21 -737 l1 -148 -47 7 c-27 3 -49 6 -50 7 -3 2 -33 743 -33 815 l0 74 51 -6 c29 -4 54 -9 57 -12z m2303 -71 c12 -14 14 -233 17 -1441 3 -1387 3 -1423 -15 -1423 -11 0 -26 6 -35 13 -15 11 -17 132 -22 1317 -4 718 -9 1370 -12 1449 l-6 144 29 -21 c17 -12 36 -29 44 -38z m-897 -205 c5 -4 10 -61 11 -126 5 -221 6 -1576 1 -1580 -2 -2 -20 3 -40 11 l-36 15 0 851 0 850 28 -6 c15 -4 31 -10 36 -15z m-2760 -56 c3 -27 8 -88 11 -138 3 -49 10 -161 16 -248 12 -176 10 -187 -47 -187 -30 0 -34 3 -38 33 -10 59 -45 551 -40 559 5 7 57 25 81 27 6 1 14 -20 17 -46z m-1654 -255 c11 -106 33 -328 49 -493 17 -165 31 -305 31 -311 0 -12 -77 -50 -85 -42 -5 5 -105 890 -105 930 0 24 77 125 87 114 3 -2 13 -91 23 -198z m3921 -105 l29 -17 1 -216 c1 -118 3 -250 3 -293 2 -90 -9 -105 -63 -86 l-31 11 0 86 c0 48 -3 187 -7 310 l-6 222 23 0 c12 0 35 -8 51 -17z m-3482 -388 c18 -192 47 -516 66 -720 l34 -370 -39 -39 -38 -39 -7 79 c-4 44 -24 248 -45 454 -21 206 -51 505 -66 664 l-28 288 39 36 c35 33 39 34 46 16 4 -10 21 -176 38 -369z m-749 -121 c22 -197 80 -721 130 -1164 50 -443 97 -870 106 -950 8 -80 22 -201 30 -270 14 -117 14 -125 -2 -137 -24 -18 -34 -16 -34 5 0 9 -9 85 -20 167 -18 137 -48 369 -115 890 -14 105 -41 314 -60 465 -20 151 -49 376 -65 500 -16 124 -43 336 -60 473 -18 136 -29 257 -26 270 7 27 66 121 72 115 2 -3 22 -166 44 -364z m-306 -431 c15 -120 43 -339 62 -488 19 -148 43 -333 54 -410 l19 -140 -21 -18 c-12 -10 -24 -14 -28 -10 -4 4 -12 44 -18 88 -6 44 -43 301 -83 570 l-71 490 23 68 c12 37 25 67 28 67 4 0 19 -98 35 -217z m5490 131 c14 -14 16 -76 16 -535 l0 -519 -28 0 c-61 0 -60 -15 -64 553 l-3 517 32 0 c17 0 39 -7 47 -16z m-2189 -179 c226 -34 423 -97 618 -197 126 -65 186 -110 326 -244 208 -199 336 -373 456 -619 175 -358 243 -675 329 -1525 39 -381 90 -1072 101 -1355 3 -82 10 -217 16 -300 11 -176 24 -152 -131 -227 -215 -104 -422 -176 -695 -243 -334 -82 -550 -108 -880 -109 l-240 -1 2 115 c0 63 6 210 12 325 30 557 24 1260 -15 1650 -22 224 -65 496 -89 556 -5 13 18 24 117 58 181 63 338 142 362 181 43 74 -34 180 -132 180 -17 0 -68 -18 -115 -39 -224 -103 -673 -224 -932 -251 -179 -19 -457 -8 -650 27 -105 19 -293 90 -450 171 -181 94 -292 219 -325 367 -18 80 -13 240 10 330 25 99 95 243 159 327 285 375 873 700 1476 814 192 36 464 40 670 9z m3085 -31 c36 -15 40 -19 40 -53 2 -273 -4 -897 -9 -923 -1 -9 -53 -10 -75 -2 -14 5 -16 59 -16 500 0 316 4 494 10 494 5 0 28 -7 50 -16z m437 -549 l36 -15 -7 -828 c-8 -1055 -9 -1086 -47 -1177 -62 -149 -59 -179 -53 475 2 327 7 658 9 735 2 77 4 294 5 483 0 228 3 342 10 342 6 0 27 -7 47 -15z m-6014 -249 c6 -81 4 -89 -25 -153 l-32 -68 -12 100 c-19 160 -19 167 19 191 17 12 35 20 38 18 3 -2 9 -42 12 -88z m-618 -603 c9 -82 79 -626 115 -893 54 -413 58 -472 34 -447 -3 3 -26 142 -50 309 -156 1078 -155 1071 -142 1079 27 18 36 8 43 -48z m720 -458 c6 -25 35 -296 35 -329 0 -28 -36 -54 -52 -38 -5 5 -18 90 -28 188 -11 99 -22 202 -25 229 l-6 50 35 -40 c20 -22 38 -49 41 -60z m807 -377 c11 -10 18 -50 27 -158 15 -195 17 -180 -24 -180 -42 0 -41 -3 -55 173 -14 179 -14 177 13 177 13 0 30 -6 39 -12z m792 -15 c2 -10 7 -70 11 -133 3 -63 12 -205 20 -315 28 -404 29 -455 12 -455 -19 0 -21 15 -43 300 -8 118 -23 304 -33 413 -9 109 -15 200 -12 202 11 12 40 3 45 -12z m-1880 -192 c6 -9 44 -329 91 -766 14 -132 28 -259 31 -283 l5 -43 -25 16 c-19 13 -26 26 -26 49 0 63 -43 478 -76 732 -19 144 -34 271 -34 283 0 21 24 29 34 12z m5771 -418 l-7 -418 -25 -37 c-57 -84 -54 -100 -51 368 l2 429 37 38 c20 20 40 37 44 37 3 0 3 -188 0 -417z m-925 -663 c5 -581 4 -626 -12 -644 -10 -11 -19 -18 -22 -15 -7 8 -17 1275 -9 1282 4 4 14 6 23 5 13 -3 16 -74 20 -628z m-3266 398 c7 -62 32 -359 42 -499 6 -94 6 -97 -16 -104 -12 -4 -26 -3 -30 2 -7 7 -29 229 -56 571 l-7 82 31 0 c29 0 31 -2 36 -52z m-786 -350 c7 -7 12 -32 12 -57 0 -26 12 -161 25 -301 38 -383 41 -435 24 -425 -26 15 -49 38 -44 44 2 4 -2 54 -10 111 -7 58 -16 152 -20 210 -4 58 -13 164 -21 235 -19 175 -18 195 4 195 10 0 23 -5 30 -12z m473 -673 c3 -22 9 -104 13 -182 7 -150 4 -161 -37 -130 -12 9 -20 47 -32 161 -21 206 -22 198 17 194 29 -3 33 -7 39 -43z" style="fill: rgb(255, 255, 255);"/>
+    <path d="M3184 5756 c-104 -45 -112 -186 -14 -236 71 -36 143 -19 180 43 70 114 -44 246 -166 193z" style="fill: rgb(255, 255, 255);"/>
+    <path d="M3862 5660 c-96 -59 -96 -201 0 -260 95 -57 218 18 218 132 0 110 -126 184 -218 128z" style="fill: rgb(255, 255, 255);"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/dotnet.svg b/static/images/platforms/dark/dotnet.svg
new file mode 100644
index 00000000000..a8ab5c09e35
--- /dev/null
+++ b/static/images/platforms/dark/dotnet.svg
@@ -0,0 +1,13 @@
+<svg width="150" height="150" viewBox="0 0 150 150" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1704_16)">
+<path d="M26.7342 95.8333C25.6736 95.8333 24.7721 95.48 24.0297 94.7731C23.2872 94.0481 22.916 93.1872 22.916 92.1905C22.916 91.1754 23.2872 90.3057 24.0297 89.5807C24.7721 88.8557 25.6736 88.4932 26.7342 88.4932C27.8125 88.4932 28.7229 88.8557 29.4653 89.5807C30.2254 90.3057 30.6055 91.1754 30.6055 92.1905C30.6055 93.1872 30.2254 94.0481 29.4653 94.7731C28.7229 95.48 27.8125 95.8333 26.7342 95.8333Z" fill="white"/>
+<path d="M69.1334 95.2352H62.2393L44.0765 66.5809C43.6169 65.8559 43.2367 65.1036 42.9363 64.3243H42.7771C42.9186 65.1582 42.9893 66.9434 42.9893 69.6799V95.2352H36.8906V56.25H44.2354L61.7887 84.2247C62.5311 85.3849 63.0084 86.1822 63.2206 86.6171H63.3265C63.1498 85.5842 63.0613 83.8352 63.0613 81.3701V56.25H69.1334V95.2352Z" fill="white"/>
+<path d="M98.8311 95.2352H77.4863V56.25H97.9827V61.7418H83.7972V72.7793H96.8692V78.2437H83.7972V89.7707H98.8311V95.2352Z" fill="white"/>
+<path d="M129.166 61.7418H118.242V95.2352H111.931V61.7418H101.033V56.25H129.166V61.7418Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_1704_16">
+<rect width="150" height="150" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/static/images/platforms/dark/erlang.svg b/static/images/platforms/dark/erlang.svg
new file mode 100755
index 00000000000..109aebb2bc1
--- /dev/null
+++ b/static/images/platforms/dark/erlang.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><g fill="#A90533"><path d="M20.7 103.9c-9.7-10.4-15.5-24.7-15.4-41.8-.1-15.1 4.7-28.1 12.9-38h-17.2v79.7l19.7.1zM111.1 103.9c4.2-4.5 8-9.8 11.4-15.9l-19-9.5c-6.7 10.8-16.4 20.8-29.9 20.9-19.6-.1-27.3-16.9-27.3-38.5h73.3c.1-2.4.1-3.6 0-4.7.5-12.9-2.9-23.7-9.1-32.1h16.5v79.7l-15.9.1zM47.5 42.4c.8-9.8 8.5-16.3 17.6-16.4 9.1 0 15.7 6.6 15.9 16.4h-33.5z"/></g></svg>
diff --git a/static/images/platforms/dark/flutter.svg b/static/images/platforms/dark/flutter.svg
new file mode 100644
index 00000000000..5732195e2d6
--- /dev/null
+++ b/static/images/platforms/dark/flutter.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg enable-background="new 0 0 1999 2474.2" viewBox="0 0 1999 2474.2" xmlns="http://www.w3.org/2000/svg">
+  <path d="M 514.28 1500.66 L 215.381 1193.992 L 1185.9 198.325 L 1783.62 198.325 M 1783.62 1117.124 L 1185.9 1117.124 L 962 1346.844 L 1260.9 1653.512" style="fill: rgb(255, 255, 255);"/>
+  <path d="M 962 1960.1 L 1185.9 2189.82 L 1783.62 2189.82 L 1260.9 1653.512" style="fill: rgb(255, 255, 255);"/>
+  <path d="M 663.807 1653.673 L 962.235 1347.407 L 1260.665 1653.592 L 962.235 1959.859 Z" style="fill: rgb(255, 255, 255);"/>
+  <path d="M 962.235 1959.859 L 1260.665 1653.673 L 1302.322 1696.413 L 1003.894 2002.599 Z" style="fill: rgb(255, 255, 255);"/>
+  <path d="M 962 1960.1 L 1405.485 1802.902 L 1260.9 1653.432" style="fill: rgb(255, 255, 255);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/go.svg b/static/images/platforms/dark/go.svg
new file mode 100644
index 00000000000..a16dba13b8a
--- /dev/null
+++ b/static/images/platforms/dark/go.svg
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(0.592273, 0, 0, 0.592273, 2.609371, 42.771217)" style="">
+    <g transform="matrix(1, 0, 0, 1, -1.688411, -5.30807)">
+      <g>
+        <g>
+          <path class="st0" d="M15.5,23.2c-0.4,0-0.5-0.2-0.3-0.5l2.1-2.7c0.2-0.3,0.7-0.5,1.1-0.5h35.7c0.4,0,0.5,0.3,0.3,0.6l-1.7,2.6 c-0.2,0.3-0.7,0.6-1,0.6L15.5,23.2z" style="fill: rgb(255, 255, 255);"/>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(1, 0, 0, 1, -1.688411, -5.30807)">
+      <g>
+        <g>
+          <path class="st0" d="M0.4,32.4c-0.4,0-0.5-0.2-0.3-0.5l2.1-2.7c0.2-0.3,0.7-0.5,1.1-0.5h45.6c0.4,0,0.6,0.3,0.5,0.6l-0.8,2.4 c-0.1,0.4-0.5,0.6-0.9,0.6L0.4,32.4z" style="fill: rgb(255, 255, 255);"/>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(1, 0, 0, 1, -1.688411, -5.30807)">
+      <g>
+        <g>
+          <path class="st0" d="M24.6,41.6c-0.4,0-0.5-0.3-0.3-0.6l1.4-2.5c0.2-0.3,0.6-0.6,1-0.6h20c0.4,0,0.6,0.3,0.6,0.7L47.1,41 c0,0.4-0.4,0.7-0.7,0.7L24.6,41.6z" style="fill: rgb(255, 255, 255);"/>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(1, 0, 0, 1, -1.688411, -5.30807)">
+      <g id="CXHf1q_1_">
+        <g>
+          <g>
+            <path class="st0" d="M128.4,21.4c-6.3,1.6-10.6,2.8-16.8,4.4c-1.5,0.4-1.6,0.5-2.9-1c-1.5-1.7-2.6-2.8-4.7-3.8 c-6.3-3.1-12.4-2.2-18.1,1.5c-6.8,4.4-10.3,10.9-10.2,19c0.1,8,5.6,14.6,13.5,15.7c6.8,0.9,12.5-1.5,17-6.6 c0.9-1.1,1.7-2.3,2.7-3.7c-3.6,0-8.1,0-19.3,0c-2.1,0-2.6-1.3-1.9-3c1.3-3.1,3.7-8.3,5.1-10.9c0.3-0.6,1-1.6,2.5-1.6 c5.1,0,23.9,0,36.4,0c-0.2,2.7-0.2,5.4-0.6,8.1c-1.1,7.2-3.8,13.8-8.2,19.6c-7.2,9.5-16.6,15.4-28.5,17 c-9.8,1.3-18.9-0.6-26.9-6.6c-7.4-5.6-11.6-13-12.7-22.2c-1.3-10.9,1.9-20.7,8.5-29.3c7.1-9.3,16.5-15.2,28-17.3 c9.4-1.7,18.4-0.6,26.5,4.9c5.3,3.5,9.1,8.3,11.6,14.1C130,20.6,129.6,21.1,128.4,21.4z" style="fill: rgb(255, 255, 255);"/>
+          </g>
+          <g>
+            <path class="st0" d="M161.5,76.7c-9.1-0.2-17.4-2.8-24.4-8.8c-5.9-5.1-9.6-11.6-10.8-19.3c-1.8-11.3,1.3-21.3,8.1-30.2 c7.3-9.6,16.1-14.6,28-16.7c10.2-1.8,19.8-0.8,28.5,5.1c7.9,5.4,12.8,12.7,14.1,22.3c1.7,13.5-2.2,24.5-11.5,33.9 c-6.6,6.7-14.7,10.9-24,12.8C166.8,76.3,164.1,76.4,161.5,76.7z M185.3,36.3c-0.1-1.3-0.1-2.3-0.3-3.3 c-1.8-9.9-10.9-15.5-20.4-13.3c-9.3,2.1-15.3,8-17.5,17.4c-1.8,7.8,2,15.7,9.2,18.9c5.5,2.4,11,2.1,16.3-0.6 C180.5,51.3,184.8,44.9,185.3,36.3z" style="fill: rgb(255, 255, 255);"/>
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/java.svg b/static/images/platforms/dark/java.svg
new file mode 100755
index 00000000000..a5ec3a293bb
--- /dev/null
+++ b/static/images/platforms/dark/java.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M47.617 98.12s-4.767 2.774 3.397 3.71c9.892 1.13 14.947.968 25.845-1.092 0 0 2.871 1.795 6.873 3.351-24.439 10.47-55.308-.607-36.115-5.969zM44.629 84.455s-5.348 3.959 2.823 4.805c10.567 1.091 18.91 1.18 33.354-1.6 0 0 1.993 2.025 5.132 3.131-29.542 8.64-62.446.68-41.309-6.336z" style="fill: rgb(255, 255, 255);"/>
+  <path d="M69.802 61.271c6.025 6.935-1.58 13.17-1.58 13.17s15.289-7.891 8.269-17.777c-6.559-9.215-11.587-13.792 15.635-29.58 0 .001-42.731 10.67-22.324 34.187z" style="fill: rgb(255, 255, 255);"/>
+  <path d="M102.123 108.229s3.529 2.91-3.888 5.159c-14.102 4.272-58.706 5.56-71.094.171-4.451-1.938 3.899-4.625 6.526-5.192 2.739-.593 4.303-.485 4.303-.485-4.953-3.487-32.013 6.85-13.743 9.815 49.821 8.076 90.817-3.637 77.896-9.468zM49.912 70.294s-22.686 5.389-8.033 7.348c6.188.828 18.518.638 30.011-.326 9.39-.789 18.813-2.474 18.813-2.474s-3.308 1.419-5.704 3.053c-23.042 6.061-67.544 3.238-54.731-2.958 10.832-5.239 19.644-4.643 19.644-4.643zM90.609 93.041c23.421-12.167 12.591-23.86 5.032-22.285-1.848.385-2.677.72-2.677.72s.688-1.079 2-1.543c14.953-5.255 26.451 15.503-4.823 23.725 0-.002.359-.327.468-.617z" style="fill: rgb(255, 255, 255);"/>
+  <path d="M76.491 1.587s12.968 12.976-12.303 32.923c-20.266 16.006-4.621 25.13-.007 35.559-11.831-10.673-20.509-20.07-14.688-28.815 8.548-12.834 32.229-19.059 26.998-39.667z" style="fill: rgb(255, 255, 255);"/>
+  <path d="M52.214 126.021c22.476 1.437 57-.8 57.817-11.436 0 0-1.571 4.032-18.577 7.231-19.186 3.612-42.854 3.191-56.887.874 0 .001 2.875 2.381 17.647 3.331z" style="fill: rgb(255, 255, 255);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/javascript.svg b/static/images/platforms/dark/javascript.svg
new file mode 100755
index 00000000000..9d84b3a6d28
--- /dev/null
+++ b/static/images/platforms/dark/javascript.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M1.408 1.408h125.184v125.185h-125.184z" style="fill: rgb(255, 255, 255);"/>
+  <path d="M116.347 96.736c-.917-5.711-4.641-10.508-15.672-14.981-3.832-1.761-8.104-3.022-9.377-5.926-.452-1.69-.512-2.642-.226-3.665.821-3.32 4.784-4.355 7.925-3.403 2.023.678 3.938 2.237 5.093 4.724 5.402-3.498 5.391-3.475 9.163-5.879-1.381-2.141-2.118-3.129-3.022-4.045-3.249-3.629-7.676-5.498-14.756-5.355l-3.688.477c-3.534.893-6.902 2.748-8.877 5.235-5.926 6.724-4.236 18.492 2.975 23.335 7.104 5.332 17.54 6.545 18.873 11.531 1.297 6.104-4.486 8.08-10.234 7.378-4.236-.881-6.592-3.034-9.139-6.949-4.688 2.713-4.688 2.713-9.508 5.485 1.143 2.499 2.344 3.63 4.26 5.795 9.068 9.198 31.76 8.746 35.83-5.176.165-.478 1.261-3.666.38-8.581zm-46.885-37.793h-11.709l-.048 30.272c0 6.438.333 12.34-.714 14.149-1.713 3.558-6.152 3.117-8.175 2.427-2.059-1.012-3.106-2.451-4.319-4.485-.333-.584-.583-1.036-.667-1.071l-9.52 5.83c1.583 3.249 3.915 6.069 6.902 7.901 4.462 2.678 10.459 3.499 16.731 2.059 4.082-1.189 7.604-3.652 9.448-7.401 2.666-4.915 2.094-10.864 2.07-17.444.06-10.735.001-21.468.001-32.237z" style="fill: rgb(28, 33, 56);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/kotlin.svg b/static/images/platforms/dark/kotlin.svg
new file mode 100644
index 00000000000..8c90c6e4762
--- /dev/null
+++ b/static/images/platforms/dark/kotlin.svg
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg preserveAspectRatio="xMidYMid" version="1.1" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" transform="matrix(0.855244, 0, 0, 0.855244, 12.89643, 9.19643)" style="">
+    <g id="twitter-profile-copy" fill-rule="nonzero" stroke-width="24">
+      <g id="Group" transform="translate(11.000000, 14.000000)">
+        <g id="kotlin-logo" transform="translate(3.000000, 0.000000)">
+          <polygon id="Shape" points="0 0 125.518 0 0 131.998" style="stroke: rgb(255, 255, 255);"/>
+          <polygon id="Shape" points="0 250 125.338 124.444 250 250" style="stroke: rgb(255, 255, 255);"/>
+          <polygon id="Shape" points="125.518 0 0 131.998 0 250 125.338 124.442 250 0" style="stroke: rgb(255, 255, 255);"/>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/nodejs.svg b/static/images/platforms/dark/nodejs.svg
new file mode 100755
index 00000000000..0a877c31b5f
--- /dev/null
+++ b/static/images/platforms/dark/nodejs.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M112.771 30.334l-44.097-25.605c-2.781-1.584-6.402-1.584-9.205 0l-44.568 25.605c-2.87 1.651-4.901 4.754-4.901 8.073v51.142c0 3.319 2.084 6.423 4.954 8.083l11.775 6.688c5.628 2.772 7.617 2.772 10.178 2.772 8.333 0 13.093-5.039 13.093-13.828v-50.49c0-.713-.371-1.774-1.071-1.774h-5.623c-.712 0-2.306 1.061-2.306 1.773v50.49c0 3.896-3.524 7.773-10.11 4.48l-12.167-7.013c-.424-.23-.723-.693-.723-1.181v-51.142c0-.482.555-.966.982-1.213l44.424-25.561c.415-.235 1.025-.235 1.439 0l43.882 25.555c.42.253.272.722.272 1.219v51.142c0 .488.183.963-.232 1.198l-44.086 25.576c-.378.227-.847.227-1.261 0l-11.307-6.749c-.341-.198-.746-.269-1.073-.086-3.146 1.783-3.726 2.02-6.677 3.043-.726.253-1.797.692.41 1.929l14.798 8.754c1.417.82 3.027 1.246 4.647 1.246 1.642 0 3.25-.426 4.667-1.246l43.885-25.582c2.87-1.672 4.23-4.764 4.23-8.083v-51.142c0-3.319-1.36-6.414-4.229-8.073zM77.91 81.445c-11.726 0-14.309-3.235-15.17-9.066-.1-.628-.633-1.379-1.272-1.379h-5.731c-.709 0-1.279.86-1.279 1.566 0 7.466 4.059 16.512 23.453 16.512 14.039 0 22.088-5.455 22.088-15.109 0-9.572-6.467-12.084-20.082-13.886-13.762-1.819-15.16-2.738-15.16-5.962 0-2.658 1.184-6.203 11.374-6.203 9.105 0 12.461 1.954 13.842 8.091.118.577.645.991 1.24.991h5.754c.354 0 .692-.143.94-.396.24-.272.367-.613.335-.979-.891-10.568-7.912-15.493-22.112-15.493-12.631 0-20.166 5.334-20.166 14.275 0 9.698 7.497 12.378 19.622 13.577 14.505 1.422 15.633 3.542 15.633 6.395 0 4.955-3.978 7.066-13.309 7.066z" style="fill: rgb(255, 255, 255);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/objective-c.svg b/static/images/platforms/dark/objective-c.svg
new file mode 100755
index 00000000000..3320c79e243
--- /dev/null
+++ b/static/images/platforms/dark/objective-c.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <g>
+    <path d="M115.4 30.7l-48.3-27.8c-.8-.5-1.9-.7-3.1-.7-1.2 0-2.3.3-3.1.7l-48 27.9c-1.7 1-2.9 3.5-2.9 5.4v55.7c0 1.1.2 2.4 1 3.5l106.8-62c-.6-1.2-1.5-2.1-2.4-2.7z" style="fill: rgb(255, 255, 255);"/>
+    <path d="M10.7 95.3c.5.8 1.2 1.5 1.9 1.9l48.2 27.9c.8.5 1.9.7 3.1.7 1.2 0 2.3-.3 3.1-.7l48-27.9c1.7-1 2.9-3.5 2.9-5.4v-55.7c0-.9-.1-1.9-.6-2.8l-106.6 62z" style="fill: rgb(255, 255, 255);"/>
+    <path d="M85.3 76.1c-4.2 7.4-12.2 12.4-21.3 12.4-13.5 0-24.5-11-24.5-24.5s11-24.5 24.5-24.5c9.1 0 17.1 5 21.3 12.5l13-7.5c-6.8-11.9-19.6-20-34.3-20-21.8 0-39.5 17.7-39.5 39.5s17.7 39.5 39.5 39.5c14.6 0 27.4-8 34.2-19.8l-12.9-7.6z" style="fill: rgb(28, 33, 56);"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/perl.svg b/static/images/platforms/dark/perl.svg
new file mode 100644
index 00000000000..6069f8f7b6d
--- /dev/null
+++ b/static/images/platforms/dark/perl.svg
@@ -0,0 +1,57 @@
+<svg version="1.1"x="0px" y="0px" viewBox="0 0 512 512" xml:space="preserve">
+        <style type="text/css">
+            .st0{fill:#374149;}
+        </style>
+        <g>
+            <path class="st0" d="M177.524,351.77c-0.454-7.015-2.004-12.351-3.493-17.558c-0.938-3.328-1.84-6.496-2.488-10.086
+                c-0.742-4.141,1.293-11.676,3.102-18.367c-2-5.481-5.39-13.141-8.809-20.57c-0.519-1.176-0.988-2.25-1.546-3.508
+                c-0.016,0.019-0.032,0.031-0.047,0.05c-0.023-0.054-0.047-0.105-0.074-0.156c-8.226,9.156-20.297,17.469-37.187,19.066
+                c-0.641,0.051-1.266,0.149-1.914,0.18l0.016,0.035c-0.059,0.004-0.11,0.015-0.164,0.019c0.129,0.355,0.258,0.711,0.386,1.035
+                c4.882,13.16,15.359,25.188,19.305,29.39c-1.262,9.895-1.649,26.094,6.176,37.993c7.469,45.461,2.941,56.586-14.227,66.703
+                c-4.074,2.426-8.343,7.309-8.019,12.32c0.191,3.102,2.133,5.723,5.367,7.145c1.875,0.809,5.918,1.91,19.141,1.91
+                c6.144,0,11.574-0.258,12.738-0.325c0.098,0.031,0.195,0.031,0.293,0.031c1.55,0,3.816-0.484,5.949-2.75
+                c3.298-3.554,7.727-12.832,7.535-52.282c-0.066-14.644-0.746-31.426-2.004-49.89L177.524,351.77z" style="fill: rgb(75, 75, 75);"></path>
+            <path class="st0" d="M445.571,353.614c3.102-7.278,5.558-13.031,1.746-21.504c-10.738-23.894-14.618-34.207-16.008-38.606
+                c-1.242-0.75-2.375-1.562-3.527-2.363c-0.91-0.637-1.817-1.274-2.688-1.949c-1.766-1.367-3.41-2.801-4.961-4.282
+                c-1.254-1.203-2.477-2.434-3.637-3.742c-0.946-1.058-1.875-2.121-2.73-3.218c-1.554-1.996-3.004-4.11-4.359-6.321
+                c-0.527-0.851-1.062-1.699-1.551-2.562c-1.699-3.046-3.277-6.226-4.613-9.644c-0.008,0.007-0.02,0.011-0.028,0.019
+                c-0.023-0.047-0.046-0.098-0.066-0.149c-1.538,1.168-3.179,2.352-4.859,3.532c-0.668,0.468-1.34,0.926-2.011,1.382
+                c-2.887,1.973-5.993,3.93-9.27,5.859c-3.172,1.836-6.344,3.695-9.594,5.242c0,0,0.004,0.008,0.008,0.012
+                c-0.046,0.023-0.094,0.05-0.141,0.074c3.426,5.242,7.242,9.801,11.219,11.966c1.875,17.394,9.473,38.09,15.55,46.625
+                c9.25,12.902,6.664,34.434,2.879,53.77c-6.434,33.207-13.614,46.336-17.75,47.531c-1.586,0.422-3.394,0.875-5.335,1.324
+                c-8.375,1.977-16.298,3.848-18.008,9.637c-0.618,2.004-0.489,5.887,2.973,9.508l1.133,1.195l1.582,0.164
+                c1.035,0.094,2.168,0.192,3.332,0.321c4.946,0.515,15.778,0.906,21.211,0.969c8.082,0.098,9.442-1,12.156-2.551
+                c4.141-2.363,6.79-11.672,15.91-40.742c1.422-4.558,2.782-8.859,3.848-12.058c3.683-11.027,12.609-37.539,16.262-46.367
+                C444.696,355.583,445.149,354.552,445.571,353.614z" style="fill: rgb(75, 75, 75);"></path>
+            <path class="st0" d="M509.59,328.876c-15.874-30.746-18.527-38.508-18.98-40.316c2.781-17.657,5.012-35.082,3.07-44.528
+                c4.594-14.191,18.336-42.258-0.871-77.922c-6.758-12.543-21.5-23.086-30.07-27.969c-9.863-5.626-19.176-10.961-28.454-26.352
+                c-16.586-27.515-36.507-56.875-62.859-56.875c-19.687,0-37.473,31.203-49.211,48.016c-5.43,7.793-7.402,12.062-15.969,12.062
+                c-5.144,0-13.515-6.824-18.949-16.234c-8.535-14.809-26.254-45.168-49.598-45.168c-19.531,0-33.434,21.531-56.941,65.828
+                c-7.504,14.102-20.078,33.274-32.95,44.782c-10.446,9.363-18.168,15.699-26.477,18.07c-0.347,0.09-0.691,0.215-1.039,0.293
+                c6.738-19.898,11.422-73.246-1.434-88.207c-0.25-0.297-0.465-0.668-0.722-0.938c7.851-5.336,10.918-16.422,9.883-19.781
+                c-0.578-1.875-3.618-3.332-9.051-3.332c-1.293,0-2.683,0.066-4.238,0.258c-2.812,0.293-5.816,1.102-9.05,2.394
+                c-0.809-0.293-1.586-0.582-2.329-0.875c-11.187-4.234-18.105-6.851-25.965-6.851c-1.355,0-2.75,0.098-4.203,0.258
+                c-5.465,0.614-9.538,2.942-13.484,5.172c-4.008,2.297-8.18,4.656-14.516,5.758c-1.906,0.321-3.914,0.614-6.078,0.871
+                c-3.106,0.324-6.047,0.551-8.895,0.742c-2.519,0.195-4.914,0.359-7.144,0.617c-4.172,0.454-8.922,1.294-12.77,3.817
+                c-3.656,2.422-8.442,7.886-9.894,15.355c-1.035,5.434-0.066,10.801,2.843,15.649c0,2.683,0.969,5.207,2.844,7.21
+                c2.652,2.782,6.922,4.399,11.547,4.399c0.742,0,1.484-0.032,2.23-0.13c1.613-0.164,3.137-0.515,4.558-1.066
+                c8.164,2.086,20.195,6.348,27.328,8.954c0.57,0.218,1.215,0.453,1.762,0.668c-8.797,16.75-23.074,46.91-14.507,81.851
+                c8.179,33.559,36.179,71.942,80.511,72.684c0.418,0.031,0.871,0.031,1.325,0.031h0.84c25.066-0.27,37.801-19.558,43.011-30.43
+                c0.367-0.734,0.699-1.426,0.996-2.062c0.301,0.27,0.524,0.492,0.68,0.645c1.324,2.652,7.66,15.617,13.254,28.098
+                c2.848,6.305,5.497,12.511,7.242,17.172c4.883,13.125,15.394,25.152,19.336,29.39c-1.262,9.894-1.648,26.058,6.145,37.988
+                c7.469,45.43,2.973,56.586-14.195,66.707c-4.106,2.426-8.34,7.274-8.051,12.286c0.195,3.137,2.168,5.758,5.367,7.145
+                c1.875,0.808,5.918,1.91,19.141,1.91c6.145,0,11.578-0.226,12.774-0.293h0.289c1.52,0,3.817-0.449,5.918-2.714
+                c3.332-3.559,7.726-12.868,7.566-52.317c-0.098-14.614-0.778-31.394-2.035-49.859v-0.387c-0.485-7.015-2.039-12.382-3.492-17.59
+                c-0.973-3.328-1.879-6.465-2.524-10.086c-0.742-4.14,1.359-11.801,3.199-18.527c1.942-7.18,3.786-13.938,3.234-18.914
+                c-0.363-3.266-1.473-6.718-2.687-9.98c-0.262-0.793-0.434-1.457-0.73-2.313c13.226,4.09,33.152,6.633,53.988,6.633
+                c11.965,0,23.895-0.809,35.438-2.426c17.493-2.457,32.594-7.758,45.168-13.969c16.145-7.946,28.055-17.438,35.563-24.414
+                c1.234-1.117,2.398-2.195,3.453-3.203c3.012,13.598,8.355,30.684,23.035,42.235c4.332,3.426,9.504,6.367,15.649,8.598
+                c2.812,17.266,11.511,37.508,18.074,45.687c9.926,12.418,8.504,34.051,5.79,53.547c-4.657,33.496-11.059,47.012-15.164,48.402
+                c-1.555,0.55-3.363,1.066-5.238,1.617c-8.278,2.458-16.07,4.719-17.493,10.606c-0.488,2.035-0.293,5.203,3.364,8.664l1.164,1.098
+                l1.613,0.066c1.035,0.066,2.168,0.13,3.332,0.165c4.946,0.258,11.09,0.578,16.555,0.578c8.473,0,13.191-0.742,15.777-2.422
+                c4.043-2.586,7.211-12.836,14.746-42.356c1.164-4.625,2.293-9.023,3.199-12.289c3.074-11.187,10.543-38.152,13.711-47.176
+                c0.386-1.098,0.778-2.168,1.129-3.137C511.692,343.009,513.857,337.122,509.59,328.876z M59.539,92.227
+                c0-2.778,2.004-5.043,4.461-5.043c2.426,0,4.43,2.266,4.43,5.043c0,2.817-2.004,5.078-4.43,5.078
+                C61.543,97.305,59.539,95.044,59.539,92.227z" style="fill: rgb(75, 75, 75);"></path>
+        </g>
+    </svg>
diff --git a/static/images/platforms/dark/php.svg b/static/images/platforms/dark/php.svg
new file mode 100755
index 00000000000..c0257f28c04
--- /dev/null
+++ b/static/images/platforms/dark/php.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M64 33.039c-33.74 0-61.094 13.862-61.094 30.961s27.354 30.961 61.094 30.961 61.094-13.862 61.094-30.961-27.354-30.961-61.094-30.961zm-15.897 36.993c-1.458 1.364-3.077 1.927-4.86 2.507-1.783.581-4.052.461-6.811.461h-6.253l-1.733 10h-7.301l6.515-34h14.04c4.224 0 7.305 1.215 9.242 3.432 1.937 2.217 2.519 5.364 1.747 9.337-.319 1.637-.856 3.159-1.614 4.515-.759 1.357-1.75 2.624-2.972 3.748zm21.311 2.968l2.881-14.42c.328-1.688.208-2.942-.361-3.555-.57-.614-1.782-1.025-3.635-1.025h-5.79l-3.731 19h-7.244l6.515-33h7.244l-1.732 9h6.453c4.061 0 6.861.815 8.402 2.231s2.003 3.356 1.387 6.528l-3.031 15.241h-7.358zm40.259-11.178c-.318 1.637-.856 3.133-1.613 4.488-.758 1.357-1.748 2.598-2.971 3.722-1.458 1.364-3.078 1.927-4.86 2.507-1.782.581-4.053.461-6.812.461h-6.253l-1.732 10h-7.301l6.514-34h14.041c4.224 0 7.305 1.215 9.241 3.432 1.935 2.217 2.518 5.418 1.746 9.39zM95.919 54h-5.001l-2.727 14h4.442c2.942 0 5.136-.29 6.576-1.4 1.442-1.108 2.413-2.828 2.918-5.421.484-2.491.264-4.434-.66-5.458-.925-1.024-2.774-1.721-5.548-1.721zM38.934 54h-5.002l-2.727 14h4.441c2.943 0 5.136-.29 6.577-1.4 1.441-1.108 2.413-2.828 2.917-5.421.484-2.491.264-4.434-.66-5.458s-2.772-1.721-5.546-1.721z" style="fill: rgb(255, 255, 255);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/python.svg b/static/images/platforms/dark/python.svg
new file mode 100755
index 00000000000..b92faafdfaa
--- /dev/null
+++ b/static/images/platforms/dark/python.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M 63.391 10.988 C 59.169 11.008 55.139 11.367 51.591 11.995 C 41.141 13.841 39.245 17.705 39.245 24.832 L 39.245 34.243 L 63.938 34.243 L 63.938 37.38 L 29.977 37.38 C 22.801 37.38 16.517 41.693 14.551 49.901 C 12.283 59.306 12.183 65.176 14.551 74.997 C 16.306 82.308 20.498 87.516 27.675 87.516 L 36.166 87.516 L 36.166 76.234 C 36.166 68.083 43.217 60.894 51.592 60.894 L 76.257 60.894 C 83.123 60.894 88.603 55.24 88.603 48.346 L 88.603 24.833 C 88.603 18.14 82.957 13.113 76.257 11.996 C 72.013 11.29 67.612 10.969 63.391 10.988 Z M 50.037 18.557 C 52.587 18.557 54.671 20.674 54.671 23.278 C 54.671 25.871 52.588 27.968 50.037 27.968 C 47.477 27.968 45.404 25.871 45.404 23.278 C 45.403 20.674 47.477 18.557 50.037 18.557 Z" style="fill: rgb(255, 255, 255);"/>
+  <path d="M 91.682 37.38 L 91.682 48.346 C 91.682 56.846 84.474 64.001 76.256 64.001 L 51.591 64.001 C 44.835 64.001 39.245 69.784 39.245 76.55 L 39.245 100.065 C 39.245 106.756 45.063 110.693 51.591 112.612 C 59.407 114.909 66.903 115.325 76.256 112.612 C 82.472 110.811 88.602 107.189 88.602 100.065 L 88.602 90.653 L 63.938 90.653 L 63.938 87.515 L 100.95 87.515 C 108.126 87.515 110.802 82.51 113.298 74.996 C 115.876 67.261 115.765 59.822 113.298 49.9 C 111.524 42.755 108.137 37.379 100.95 37.379 L 91.682 37.379 Z M 77.809 96.927 C 80.37 96.927 82.443 99.024 82.443 101.619 C 82.443 104.221 80.369 106.338 77.809 106.338 C 75.259 106.338 73.176 104.221 73.176 101.619 C 73.176 99.024 75.259 96.927 77.809 96.927 Z" style="fill: rgb(255, 255, 255);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/react.svg b/static/images/platforms/dark/react.svg
new file mode 100644
index 00000000000..0a71ebe3469
--- /dev/null
+++ b/static/images/platforms/dark/react.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" enable-background="new 0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <g fill="#61DAFB">
+    <circle cx="64" cy="64" r="11.4" style="fill: rgb(255, 255, 255);"/>
+    <path d="M107.3 45.2c-2.2-.8-4.5-1.6-6.9-2.3.6-2.4 1.1-4.8 1.5-7.1 2.1-13.2-.2-22.5-6.6-26.1-1.9-1.1-4-1.6-6.4-1.6-7 0-15.9 5.2-24.9 13.9-9-8.7-17.9-13.9-24.9-13.9-2.4 0-4.5.5-6.4 1.6-6.4 3.7-8.7 13-6.6 26.1.4 2.3.9 4.7 1.5 7.1-2.4.7-4.7 1.4-6.9 2.3-12.5 4.8-19.3 11.4-19.3 18.8s6.9 14 19.3 18.8c2.2.8 4.5 1.6 6.9 2.3-.6 2.4-1.1 4.8-1.5 7.1-2.1 13.2.2 22.5 6.6 26.1 1.9 1.1 4 1.6 6.4 1.6 7.1 0 16-5.2 24.9-13.9 9 8.7 17.9 13.9 24.9 13.9 2.4 0 4.5-.5 6.4-1.6 6.4-3.7 8.7-13 6.6-26.1-.4-2.3-.9-4.7-1.5-7.1 2.4-.7 4.7-1.4 6.9-2.3 12.5-4.8 19.3-11.4 19.3-18.8s-6.8-14-19.3-18.8zm-14.8-30.5c4.1 2.4 5.5 9.8 3.8 20.3-.3 2.1-.8 4.3-1.4 6.6-5.2-1.2-10.7-2-16.5-2.5-3.4-4.8-6.9-9.1-10.4-13 7.4-7.3 14.9-12.3 21-12.3 1.3 0 2.5.3 3.5.9zm-11.2 59.3c-1.8 3.2-3.9 6.4-6.1 9.6-3.7.3-7.4.4-11.2.4-3.9 0-7.6-.1-11.2-.4-2.2-3.2-4.2-6.4-6-9.6-1.9-3.3-3.7-6.7-5.3-10 1.6-3.3 3.4-6.7 5.3-10 1.8-3.2 3.9-6.4 6.1-9.6 3.7-.3 7.4-.4 11.2-.4 3.9 0 7.6.1 11.2.4 2.2 3.2 4.2 6.4 6 9.6 1.9 3.3 3.7 6.7 5.3 10-1.7 3.3-3.4 6.6-5.3 10zm8.3-3.3c1.5 3.5 2.7 6.9 3.8 10.3-3.4.8-7 1.4-10.8 1.9 1.2-1.9 2.5-3.9 3.6-6 1.2-2.1 2.3-4.2 3.4-6.2zm-25.6 27.1c-2.4-2.6-4.7-5.4-6.9-8.3 2.3.1 4.6.2 6.9.2 2.3 0 4.6-.1 6.9-.2-2.2 2.9-4.5 5.7-6.9 8.3zm-18.6-15c-3.8-.5-7.4-1.1-10.8-1.9 1.1-3.3 2.3-6.8 3.8-10.3 1.1 2 2.2 4.1 3.4 6.1 1.2 2.2 2.4 4.1 3.6 6.1zm-7-25.5c-1.5-3.5-2.7-6.9-3.8-10.3 3.4-.8 7-1.4 10.8-1.9-1.2 1.9-2.5 3.9-3.6 6-1.2 2.1-2.3 4.2-3.4 6.2zm25.6-27.1c2.4 2.6 4.7 5.4 6.9 8.3-2.3-.1-4.6-.2-6.9-.2-2.3 0-4.6.1-6.9.2 2.2-2.9 4.5-5.7 6.9-8.3zm22.2 21l-3.6-6c3.8.5 7.4 1.1 10.8 1.9-1.1 3.3-2.3 6.8-3.8 10.3-1.1-2.1-2.2-4.2-3.4-6.2zm-54.5-16.2c-1.7-10.5-.3-17.9 3.8-20.3 1-.6 2.2-.9 3.5-.9 6 0 13.5 4.9 21 12.3-3.5 3.8-7 8.2-10.4 13-5.8.5-11.3 1.4-16.5 2.5-.6-2.3-1-4.5-1.4-6.6zm-24.7 29c0-4.7 5.7-9.7 15.7-13.4 2-.8 4.2-1.5 6.4-2.1 1.6 5 3.6 10.3 6 15.6-2.4 5.3-4.5 10.5-6 15.5-13.8-4-22.1-10-22.1-15.6zm28.5 49.3c-4.1-2.4-5.5-9.8-3.8-20.3.3-2.1.8-4.3 1.4-6.6 5.2 1.2 10.7 2 16.5 2.5 3.4 4.8 6.9 9.1 10.4 13-7.4 7.3-14.9 12.3-21 12.3-1.3 0-2.5-.3-3.5-.9zm60.8-20.3c1.7 10.5.3 17.9-3.8 20.3-1 .6-2.2.9-3.5.9-6 0-13.5-4.9-21-12.3 3.5-3.8 7-8.2 10.4-13 5.8-.5 11.3-1.4 16.5-2.5.6 2.3 1 4.5 1.4 6.6zm9-15.6c-2 .8-4.2 1.5-6.4 2.1-1.6-5-3.6-10.3-6-15.6 2.4-5.3 4.5-10.5 6-15.5 13.8 4 22.1 10 22.1 15.6 0 4.7-5.8 9.7-15.7 13.4z" style="fill: rgb(255, 255, 255);"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/ruby.svg b/static/images/platforms/dark/ruby.svg
new file mode 100755
index 00000000000..ec05b20fa2a
--- /dev/null
+++ b/static/images/platforms/dark/ruby.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M35.971 111.33c27.466 3.75 54.444 7.433 81.958 11.188-9.374-15.606-18.507-30.813-27.713-46.144l-54.245 34.956zM125.681 24.947c-2.421 3.636-4.847 7.269-7.265 10.907-8.304 12.493-16.607 24.986-24.903 37.485-.462.696-1.061 1.248-.41 2.321 8.016 13.237 15.969 26.513 23.942 39.777 1.258 2.095 2.53 4.182 4.157 6.192 1.612-32.193 3.223-64.387 4.834-96.58l-.355-.102zM16.252 66.22c.375.355 1.311.562 1.747.347 7.689-3.779 15.427-7.474 22.948-11.564 2.453-1.333 4.339-3.723 6.452-5.661 6.997-6.417 13.983-12.847 20.966-19.278.427-.395.933-.777 1.188-1.275 2.508-4.902 4.973-9.829 7.525-14.898-3.043-1.144-5.928-2.263-8.849-3.281-.396-.138-1.02.136-1.449.375-6.761 3.777-13.649 7.353-20.195 11.472-3.275 2.061-5.943 5.098-8.843 7.743-4.674 4.266-9.342 8.542-13.948 12.882-1.222 1.152-2.336 2.468-3.288 3.854-3.15 4.587-6.206 9.24-9.402 14.025 1.786 1.847 3.41 3.613 5.148 5.259zM44.354 59.949c-3.825 16.159-7.627 32.227-11.556 48.823 18.423-11.871 36.421-23.468 54.3-34.987-14.228-4.605-28.41-9.196-42.744-13.836zM120.985 25.103c-15.566 2.601-30.76 5.139-46.15 7.71 5.242 12.751 10.379 25.246 15.662 38.096 10.221-15.359 20.24-30.41 30.488-45.806zM44.996 56.644c14.017 4.55 27.755 9.01 41.892 13.6-5.25-12.79-10.32-25.133-15.495-37.737-8.815 8.059-17.498 15.999-26.397 24.137zM16.831 75.643c-4.971 11.883-9.773 23.362-14.662 35.048 9.396-.278 18.504-.547 27.925-.825-4.423-11.412-8.759-22.6-13.263-34.223zM30.424 101.739l.346-.076c3.353-13.941 6.754-27.786 10.177-42.272-7.636 3.969-14.92 7.754-22.403 11.644 3.819 9.926 7.891 20.397 11.88 30.704zM115.351 22.842c-4.459-1.181-8.918-2.366-13.379-3.539-6.412-1.686-12.829-3.351-19.237-5.052-.801-.213-1.38-.352-1.851.613-2.265 4.64-4.6 9.245-6.901 13.868-.071.143-.056.328-.111.687 13.886-2.104 27.679-4.195 41.47-6.285l.009-.292zM89.482 12.288l36.343 10.054c-2.084-5.939-4.017-11.446-6.005-17.11l-30.285 6.715-.053.341zM33.505 114.007c-4.501-.519-9.122-.042-13.687.037-3.75.063-7.5.206-11.25.323-.386.012-.771.09-1.156.506 31.003 2.866 62.005 5.732 93.007 8.6l.063-.414c-9.938-1.357-19.877-2.714-29.815-4.07-12.384-1.691-24.747-3.551-37.162-4.982zM2.782 99.994c3.995-9.27 7.973-18.546 11.984-27.809.401-.929.37-1.56-.415-2.308-1.678-1.597-3.237-3.318-5.071-5.226-2.479 12.24-4.897 24.177-7.317 36.113l.271.127c.185-.297.411-.578.548-.897zM81.522 9.841c6.737-1.738 13.572-3.097 20.367-4.613.44-.099.87-.244 1.303-.368l-.067-.332c-9.571 1.287-19.141 2.575-29.194 3.928 2.741 1.197 4.853 2.091 7.591 1.385z" style="fill: rgb(255, 255, 255);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/scala.svg b/static/images/platforms/dark/scala.svg
new file mode 100644
index 00000000000..0267a43a7cf
--- /dev/null
+++ b/static/images/platforms/dark/scala.svg
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg preserveAspectRatio="xMidYMid" version="1.1" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient x1="0" y1="0.5" x2="1" y2="0.5" id="linearGradient-1">
+      <stop stop-color="#4F4F4F" offset="0"/>
+      <stop stop-color="#000000" offset="1"/>
+    </linearGradient>
+    <linearGradient x1="0" y1="0.5" x2="1" y2="0.5" id="linearGradient-2">
+      <stop stop-color="#C40000" offset="0"/>
+      <stop stop-color="#FF0000" offset="1"/>
+    </linearGradient>
+  </defs>
+  <g transform="matrix(0.592336, 0, 0, 0.592336, 52.180992, 4.794112)">
+    <path d="M0,288 L0,256 C0,250.606222 116.376889,241.571556 192.199111,224 L192.199111,224 C228.828444,232.490667 256,242.968889 256,256 L256,256 L256,288 C256,301.024 228.828444,311.509333 192.199111,320 L192.199111,320 C116.376889,302.424889 0,293.390222 0,288" fill="url(#linearGradient-1)" transform="translate(128.000000, 272.000000) scale(1, -1) translate(-128.000000, -272.000000) "/>
+    <path d="M0,160 L0,128 C0,122.606222 116.376889,113.571556 192.199111,96 L192.199111,96 C228.828444,104.490667 256,114.968889 256,128 L256,128 L256,160 C256,173.024 228.828444,183.509333 192.199111,192 L192.199111,192 C116.376889,174.424889 0,165.390222 0,160" fill="url(#linearGradient-1)" transform="translate(128.000000, 144.000000) scale(1, -1) translate(-128.000000, -144.000000) "/>
+    <path d="M0,224 L0,128 C0,136 256,152 256,192 L256,192 L256,288 C256,248 0,232 0,224" fill="url(#linearGradient-2)" transform="translate(128.000000, 208.000000) scale(1, -1) translate(-128.000000, -208.000000) "/>
+    <path d="M0,96 L0,0 C0,8 256,24 256,64 L256,64 L256,160 C256,120 0,104 0,96" fill="url(#linearGradient-2)" transform="translate(128.000000, 80.000000) scale(1, -1) translate(-128.000000, -80.000000) "/>
+    <path d="M0,352 L0,256 C0,264 256,280 256,320 L256,320 L256,416 C256,376 0,360 0,352" fill="url(#linearGradient-2)" transform="translate(128.000000, 336.000000) scale(1, -1) translate(-128.000000, -336.000000) "/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/svelte.svg b/static/images/platforms/dark/svelte.svg
new file mode 100644
index 00000000000..a5203cf77e0
--- /dev/null
+++ b/static/images/platforms/dark/svelte.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M 110.846 18.026 C 99.182 1.33 76.145 -3.618 59.489 6.995 L 30.236 25.639 C 22.247 30.666 16.741 38.826 15.075 48.118 C 13.68 55.859 14.906 63.844 18.56 70.809 C 16.056 74.607 14.348 78.875 13.54 83.352 C 11.856 92.822 14.059 102.571 19.649 110.399 C 31.317 127.094 54.353 132.04 71.007 121.428 L 100.259 102.784 C 108.251 97.757 113.754 89.597 115.421 80.305 C 116.816 72.564 115.59 64.581 111.939 57.615 C 114.442 53.815 116.148 49.549 116.956 45.072 C 118.641 35.602 116.439 25.852 110.847 18.026" style="fill: rgb(255, 255, 255);"/>
+  <path d="M 56.632 111.968 C 47.202 114.421 37.245 110.729 31.692 102.725 C 28.328 98.017 27.004 92.154 28.017 86.459 C 28.187 85.534 28.421 84.622 28.716 83.728 L 29.267 82.048 L 30.766 83.148 C 34.226 85.692 38.097 87.626 42.209 88.866 L 43.295 89.195 L 43.195 90.28 C 43.063 91.825 43.481 93.366 44.376 94.63 C 46.046 97.042 49.045 98.155 51.884 97.418 C 52.52 97.247 53.125 96.982 53.681 96.627 L 82.935 77.986 C 84.382 77.074 85.381 75.596 85.683 73.914 C 85.987 72.196 85.588 70.43 84.576 69.011 C 82.903 66.598 79.905 65.485 77.064 66.222 C 76.43 66.393 75.823 66.658 75.269 67.012 L 64.107 74.128 C 62.271 75.295 60.268 76.174 58.166 76.735 C 48.737 79.187 38.78 75.496 33.227 67.491 C 29.863 62.784 28.539 56.921 29.552 51.226 C 30.555 45.638 33.864 40.732 38.67 37.71 L 67.921 19.067 C 69.757 17.897 71.762 17.017 73.865 16.454 C 83.294 14.003 93.252 17.694 98.805 25.699 C 102.168 30.405 103.492 36.268 102.48 41.964 C 102.309 42.889 102.076 43.802 101.781 44.696 L 101.23 46.376 L 99.732 45.277 C 96.27 42.733 92.401 40.798 88.288 39.557 L 87.2 39.227 L 87.302 38.142 C 87.433 36.599 87.014 35.058 86.122 33.792 C 84.449 31.381 81.451 30.269 78.612 31.005 C 77.976 31.176 77.371 31.442 76.815 31.795 L 47.562 50.439 C 46.115 51.349 45.117 52.827 44.815 54.51 C 44.51 56.225 44.909 57.993 45.921 59.412 C 47.593 61.824 50.591 62.937 53.433 62.201 C 54.068 62.031 54.673 61.763 55.23 61.412 L 66.39 54.298 C 68.225 53.129 70.228 52.249 72.33 51.687 C 81.76 49.235 91.717 52.926 97.27 60.931 C 100.633 65.639 101.958 71.502 100.946 77.196 C 99.941 82.785 96.632 87.692 91.826 90.716 L 62.576 109.357 C 60.739 110.527 58.735 111.407 56.632 111.968" style="fill: rgb(28, 33, 56);"/>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/swift.svg b/static/images/platforms/dark/swift.svg
new file mode 100755
index 00000000000..492c9cf837c
--- /dev/null
+++ b/static/images/platforms/dark/swift.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="Swift" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <style>.cls-1{fill:#f05138;}.cls-2{fill:#fefefe;}</style>
+  </defs>
+  <title>Artboard 1</title>
+  <g id="orignal">
+    <path class="cls-1" d="M126.33,34.06a39.32,39.32,0,0,0-.79-7.83,28.78,28.78,0,0,0-2.65-7.58,28.84,28.84,0,0,0-4.76-6.32,23.42,23.42,0,0,0-6.62-4.55,27.27,27.27,0,0,0-7.68-2.53c-2.65-.51-5.56-.51-8.21-.76H30.25A45.46,45.46,0,0,0,24.16,5a21.82,21.82,0,0,0-5.82,1.52c-.53.25-1.32.51-1.85.76a33.82,33.82,0,0,0-5,3.28c-.53.51-1.06.76-1.59,1.26a22.41,22.41,0,0,0-4.76,6.32,23.61,23.61,0,0,0-2.65,7.58,78.5,78.5,0,0,0-.79,7.83V93.94a39.32,39.32,0,0,0,.79,7.83,28.78,28.78,0,0,0,2.65,7.58,28.84,28.84,0,0,0,4.76,6.32,23.42,23.42,0,0,0,6.62,4.55,27.27,27.27,0,0,0,7.68,2.53c2.65.51,5.56.51,8.21.76H95.63a45.08,45.08,0,0,0,8.21-.76,27.27,27.27,0,0,0,7.68-2.53,30.13,30.13,0,0,0,6.62-4.55,22.41,22.41,0,0,0,4.76-6.32,23.61,23.61,0,0,0,2.65-7.58,78.49,78.49,0,0,0,.79-7.83V34.06Z" style="fill: rgb(255, 255, 255);"/>
+    <path class="cls-2" d="M85,96.5c-11.11,6.13-26.38,6.76-41.75.47A64.53,64.53,0,0,1,13.84,73a50,50,0,0,0,10.85,6.32c15.87,7.1,31.73,6.61,42.9,0l0,0C51.69,67.66,38.19,52.5,28.13,40.12a43.47,43.47,0,0,1-5.29-6.82C35,43.91,54.34,57.3,61.22,61.09a271.77,271.77,0,0,1-27-32.34A266.8,266.8,0,0,0,78.69,63.62c.71.38,1.26.7,1.7,1a32.7,32.7,0,0,0,1.21-3.51c3.71-12.89-.53-27.54-9.79-39.67C93.25,33.81,106,57.05,100.66,76.51c-.14.53-.29,1-.45,1.55l.19.22c10.59,12.63,7.68,26,6.35,23.5C101,91,90.37,94.33,85,96.5Z" style="fill: rgb(28, 33, 56);"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/typescript.svg b/static/images/platforms/dark/typescript.svg
new file mode 100644
index 00000000000..51eaae1b8e7
--- /dev/null
+++ b/static/images/platforms/dark/typescript.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="typescript" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <style>.cls-1{fill:#fff;}.cls-2{fill:#007acc;}</style>
+  </defs>
+  <title>Artboard 3</title>
+  <g id="original">
+    <rect class="cls-1" x="22.67" y="47" width="99.67" height="73.67" style="fill: rgb(28, 33, 56);"/>
+    <path id="original-2" data-name="original" class="cls-2" d="M1.5,63.91v62.5h125V1.41H1.5Zm100.73-5a15.56,15.56,0,0,1,7.82,4.5,20.58,20.58,0,0,1,3,4c0,.16-5.4,3.81-8.69,5.85-.12.08-.6-.44-1.13-1.23a7.09,7.09,0,0,0-5.87-3.53c-3.79-.26-6.23,1.73-6.21,5a4.58,4.58,0,0,0,.54,2.34c.83,1.73,2.38,2.76,7.24,4.86,8.95,3.85,12.78,6.39,15.16,10,2.66,4,3.25,10.46,1.45,15.24-2,5.2-6.9,8.73-13.83,9.9a38.32,38.32,0,0,1-9.52-.1,23,23,0,0,1-12.72-6.63c-1.15-1.27-3.39-4.58-3.25-4.82a9.34,9.34,0,0,1,1.15-.73L82,101l3.59-2.08.75,1.11a16.78,16.78,0,0,0,4.74,4.54c4,2.1,9.46,1.81,12.16-.62a5.43,5.43,0,0,0,.69-6.92c-1-1.39-3-2.56-8.59-5-6.45-2.78-9.23-4.5-11.77-7.24a16.48,16.48,0,0,1-3.43-6.25,25,25,0,0,1-.22-8c1.33-6.23,6-10.58,12.82-11.87A31.66,31.66,0,0,1,102.23,58.93ZM72.89,64.15l0,5.12H56.66V115.5H45.15V69.26H28.88v-5A49.19,49.19,0,0,1,29,59.09C29.08,59,39,59,51,59L72.83,59Z" style="fill: rgb(255, 255, 255);"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/vue.svg b/static/images/platforms/dark/vue.svg
new file mode 100644
index 00000000000..de6ea8f3994
--- /dev/null
+++ b/static/images/platforms/dark/vue.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg height="128" viewBox="0 0 128 128" width="128" version="1.1" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(.31919 0 0 .31919 .31532 .63390)">
+    <path d="m-0.9879 26.003 156.19 0.497 44.8 76.49 44.8-76.49 155.23-0.495-199.99 345.04zm397.84 1.997-76.35 0.065-120.53 206.94-120.47-206.94-77.54-0.06 198.04 338.01z" style="fill: rgb(255, 255, 255);"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/platforms/dark/web.svg b/static/images/platforms/dark/web.svg
new file mode 100755
index 00000000000..9d84b3a6d28
--- /dev/null
+++ b/static/images/platforms/dark/web.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M1.408 1.408h125.184v125.185h-125.184z" style="fill: rgb(255, 255, 255);"/>
+  <path d="M116.347 96.736c-.917-5.711-4.641-10.508-15.672-14.981-3.832-1.761-8.104-3.022-9.377-5.926-.452-1.69-.512-2.642-.226-3.665.821-3.32 4.784-4.355 7.925-3.403 2.023.678 3.938 2.237 5.093 4.724 5.402-3.498 5.391-3.475 9.163-5.879-1.381-2.141-2.118-3.129-3.022-4.045-3.249-3.629-7.676-5.498-14.756-5.355l-3.688.477c-3.534.893-6.902 2.748-8.877 5.235-5.926 6.724-4.236 18.492 2.975 23.335 7.104 5.332 17.54 6.545 18.873 11.531 1.297 6.104-4.486 8.08-10.234 7.378-4.236-.881-6.592-3.034-9.139-6.949-4.688 2.713-4.688 2.713-9.508 5.485 1.143 2.499 2.344 3.63 4.26 5.795 9.068 9.198 31.76 8.746 35.83-5.176.165-.478 1.261-3.666.38-8.581zm-46.885-37.793h-11.709l-.048 30.272c0 6.438.333 12.34-.714 14.149-1.713 3.558-6.152 3.117-8.175 2.427-2.059-1.012-3.106-2.451-4.319-4.485-.333-.584-.583-1.036-.667-1.071l-9.52 5.83c1.583 3.249 3.915 6.069 6.902 7.901 4.462 2.678 10.459 3.499 16.731 2.059 4.082-1.189 7.604-3.652 9.448-7.401 2.666-4.915 2.094-10.864 2.07-17.444.06-10.735.001-21.468.001-32.237z" style="fill: rgb(28, 33, 56);"/>
+</svg>
\ No newline at end of file
