feat(scripts): added icon usage script

.github/instructions/metadata.instructions.md

@@ -15,70 +15,6 @@ The `tags` property is an array of strings that describe the icon and can be use
 Validate the tags against the `icon.schema.json` to ensure they are correctly formatted and adhere to the defined structure.
 Provide tag suggestions based on the name of the icon and the use cases provided in the PR description. Use the existing tags in the repository as a reference for consistency and to avoid duplicates. Don't suggest words like: 'icon' and preferably use single words. Tags should always be in lowercase, and may also contain spaces (e.g. `magnifying glass`). The name of icon should not be included in the tags, as it is already specified.
 
-## Categories
+# Categories
 
 The `categories` property is an array of strings that specify the categories to which the icon belongs, such as "devices", "interface", "media", etc. See the `categories` property in the `icon.schema.json` for more details on the allowed values. The categories should be chosen based on the use cases provided in the PR description and the existing categories in the repository. The categories should be relevant to the icon and should help users find the icon when searching for specific types of icons. The name of icon should not be included in the categories, as it is already specified. Suggest categories based on the name of the icon and the use cases provided in the PR description. Use the existing categories in the repository as a reference for consistency and to avoid duplicates. Categories should always be in lowercase and should not contain spaces.
-
-## Use Cases
-
-The `use-cases` property is an array of strings that describe the specific scenarios in which the icon would be used. Each use case should be concise and clearly convey the context in which the icon is applicable. Use the existing use cases in the repository as a reference for consistency and to avoid duplicates.
-
-### Writing icon use-cases
-
-A use-case tells a reader **where and why an icon would be used in a real interface**. Each entry should let someone who has never seen the icon understand what it's for.
-
-### Format
-
-- Write each use-case as a short phrase, not a sentence. Start with a present participle verb: *Representing…*, *Indicating…*, *Marking…*, *Showing…*, *Confirming…*, *Toggling…*, *Categorizing…*, *Searching…*.
-- Keep it to roughly 4–12 words. One clear idea per entry.
-- No trailing period. No leading bullet, number, or dash (the surrounding format supplies that).
-- Give each icon 1–4 use-cases, ordered most-common first. Prefer fewer strong entries over many weak or repetitive ones.
-
-### Voice
-
-- Write from the interface's perspective, describing the function: "Indicating a low battery charge level" — not the requester's story ("I need an icon that shows…").
-- Name the concrete context where useful: *in smart home apps*, *in navigation apps*, *in text editors*, *on maps*. Context is what makes a use-case self-explanatory.
-- Be neutral and factual. No first person, no marketing adjectives ("perfect for", "ideal", "beautiful"), no emoji.
-
-### What to exclude
-
-- **The requester's personal narrative.** "I'm building a SvelteKit UI and need…" → drop the framing, keep the function.
-- **References to other issues, PRs, or icons by ID.** No "As provided in #1865", "complementary to git-branch-plus", "same as above", "see #2055".
-- **Design/implementation chatter.** Bezier offsets, grid alignment, path cuts, "the icon works perfectly" — none of that is a use-case.
-- **Restating the icon's name.** For `microchip`, "microchip" is not a use-case; describe what it represents ("Representing processors, chips, or embedded hardware").
-- **Links, image tags, emoji, and markdown artifacts.**
-- **Meta-commentary.** "Self-explanatory", "lots and lots of use cases", "obvious :)".
-
-### Cross-contamination
-
-When a request covers several icons at once, assign each use-case only to the icon it actually describes. A bullet prefixed with another icon's name belongs to that icon, not this one. Don't let `briefcase-medical`'s meanings leak into `briefcase-business`.
-
-### Variants
-
-Related icons should get **variant-specific** wording, not one shared blurb. `battery-low` → "Indicating a low battery charge level"; `battery-full` → "…full…". `square-arrow-right-enter` → sign in / join; `-exit` → sign out / export. Resist copying the same line across a family.
-
-### Deriving from source material
-
-When mining descriptions, comments, or linked issues:
-
-- Prefer the **stated purpose** over the backstory. Extract the function, discard the anecdote.
-- If a source lists genuinely distinct uses, keep them as separate entries; if it repeats one idea five ways, collapse to one.
-- Merge an intro line with its bullets ("To represent:" + "pottery" → "Representing pottery").
-- If the only signal is noise (a name restatement, a link, "thanks!"), leave the icon without a use-case rather than inventing one.
-- Never fabricate a use-case that isn't supported by the icon's meaning or the source.
-
-## Examples
-
-Good:
-
-- `ambulance` → "Directing users to nearby emergency services in navigation apps"
-- `calendar-sync` → "Representing recurring events, promotions, or limited-time offers"
-- `globe-x` → "Indicating a device or application is offline or unreachable"
-- `heading-2` → "Applying a level-2 heading in text editors"
-
-Poor → fixed:
-
-- ~~"I need a firewall icon :-)"~~ → "Representing firewalls and firewall rules on cybersecurity platforms"
-- ~~"As above"~~ → "Signifying a deal, agreement, or partnership"
-- ~~"microchip"~~ → "Representing processors, chips, or embedded hardware"
-- ~~"Same use cases as the other currency symbols, except Turkish lira"~~ → "Displaying prices or amounts in Turkish lira"

.github/instructions/ux-writing.instructions.md

@@ -1,587 +0,0 @@
----
-applyTo: "docs/*.md"
----
-# UX writing guidelines
-
-Follow these guidelines when writing or editing Lucide documentation, especially Markdown files.
-
-Write for people who are trying to understand a concept, follow a specification, or complete a task. Prioritize clarity, precision, and scannability over personality or decorative prose.
-
-## Be direct and concise
-
-State the important information first. Remove words that do not add meaning.
-
-Prefer short sentences and paragraphs, but do not sacrifice precision just to make text shorter.
-
-**Do:**
-
-> Icons must use a 24 × 24 pixel canvas.
-
-**Don't:**
-
-> When creating a new icon, you should make sure that the canvas you're working with has dimensions of 24 × 24 pixels.
-
-Avoid unnecessary introductions such as:
-
-- "It's important to note that…"
-- "Keep in mind that…"
-- "As you can see…"
-- "In order to…"
-- "It should be noted that…"
-
-State the information directly instead.
-
-## Put the rule before the explanation
-
-When documenting a requirement or recommendation, state it before explaining why it exists.
-
-**Do:**
-
-> Keep at least 1 pixel of space between unrelated elements. This prevents shapes from visually merging at small sizes.
-
-**Don't:**
-
-> Because shapes can visually merge at small sizes, it's important to make sure that unrelated elements have enough space between them.
-
-This makes documentation easier to scan and makes normative requirements easier to identify.
-
-## Explain the reason when it adds value
-
-Explain *why* a rule exists when the reasoning helps contributors apply it to situations that are not explicitly documented.
-
-Do not merely restate the rule.
-
-**Do:**
-
-> Avoid simulated fills. They don't scale consistently with the rest of the icon set.
-
-**Don't:**
-
-> Avoid simulated fills because simulated fills should not be used.
-
-Reasoning is particularly useful for design rules where contributors may need to evaluate unusual cases.
-
-## Use scannable structure
-
-Assume readers will scan the page before reading it in detail.
-
-Use:
-
-- descriptive headings
-- short paragraphs
-- lists for sets of related items
-- examples for rules that benefit from demonstration
-- **bold** for important terms or short emphasis
-- code formatting for filenames, properties, commands, values, and identifiers
-
-Avoid long uninterrupted blocks of text.
-
-Headings should communicate the subject or rule without requiring the surrounding text for context.
-
-**Do:**
-
-> ## Keep 1 pixel of safe space
-
-**Don't:**
-
-> ## Spacing
-
-## Use sentence case
-
-Use sentence case for:
-
-- page titles
-- headings
-- table headings
-- labels
-- example captions
-
-Capitalize proper nouns and branded terms normally.
-
-**Do:**
-
-> ## Use consistent corner radii
-
-**Don't:**
-
-> ## Use Consistent Corner Radii
-
-## Address the reader directly
-
-Use **you** and **your** when referring to something the reader does.
-
-**Do:**
-
-> If your icon contains overlapping shapes, simplify the hidden geometry.
-
-Avoid referring to the reader as "the user," "the contributor," or other third-person terms when direct language is more natural.
-
-However, prefer an imperative when the subject is obvious.
-
-**Prefer:**
-
-> Keep related elements visually grouped.
-
-**Over:**
-
-> You should keep related elements visually grouped.
-
-## Use "we" only when it means the Lucide project or maintainers
-
-First-person plural is acceptable when describing an intentional project decision, convention, or policy.
-
-**Do:**
-
-> We use `kebab-case` for icon names.
-
-> We generally avoid adding brand logos to Lucide.
-
-Do not use "we" merely to make documentation conversational.
-
-**Prefer:**
-
-> Icons use a 2 pixel stroke.
-
-**Over:**
-
-> We use a 2 pixel stroke for our icons.
-
-## Use normative language consistently
-
-Use specific language to communicate how strictly a rule applies.
-
-- **must** — required; violating this is not acceptable
-- **must not** — prohibited
-- **should** — recommended; exceptions may be appropriate
-- **should not** — discouraged; exceptions may be appropriate
-- **can** — possible or permitted
-- **may** — optional or dependent on context
-
-Do not use **should** when something is actually required.
-
-**Do:**
-
-> Icons must use a 24 × 24 pixel canvas.
-
-**Don't:**
-
-> Icons should use a 24 × 24 pixel canvas.
-
-Avoid vague substitutes such as "ideally," "normally," or "preferably" when a more precise normative term applies.
-
-## Prefer active voice
-
-Use active voice unless passive voice makes the subject clearer or avoids unnecessary repetition.
-
-**Do:**
-
-> Align nodes to the pixel grid.
-
-**Don't:**
-
-> Nodes should be aligned to the pixel grid.
-
-Passive voice is acceptable when the actor is irrelevant.
-
-> Deprecated icons are removed in major releases.
-
-## Use positive instructions when possible
-
-Tell readers what to do rather than only what not to do.
-
-**Do:**
-
-> Use a single continuous path when the elements form one continuous shape.
-
-**Less useful:**
-
-> Don't split continuous shapes into unnecessary paths.
-
-Use negative instructions when the prohibition itself is important.
-
-> Don't use simulated fills.
-
-## Be precise about consequences
-
-When explaining why something should or should not be done, describe the actual consequence rather than using vague warnings.
-
-**Do:**
-
-> Keep unrelated elements at least 2 pixels apart. Smaller gaps can disappear when the icon is rendered at small sizes.
-
-**Don't:**
-
-> Be careful when placing elements too close together.
-
-Avoid language that exaggerates consequences or attempts to influence a contributor's decision emotionally.
-
-## Prefer concrete language
-
-Use specific terms instead of vague references.
-
-**Do:**
-
-> The two endpoints must remain inside the 1 pixel safe zone.
-
-**Don't:**
-
-> These should stay within the appropriate area.
-
-Avoid ambiguous references such as:
-
-- this
-- that
-- it
-- things
-- stuff
-- appropriate
-- proper
-- correct
-
-when the intended subject can be named directly.
-
-## Introduce terminology before relying on it
-
-Define Lucide-specific or technical terms when readers may not already know them.
-
-Once defined, use the same term consistently.
-
-**Do:**
-
-> The **safe zone** is the 1 pixel area between the icon artwork and the canvas boundary.
-
-Do not alternate between different terms for the same concept unless the distinction is intentional.
-
-For example, don't alternate between "safe zone," "padding," and "margin" if they refer to the same rule.
-
-## Use abbreviations sparingly
-
-Spell out uncommon abbreviations on first use.
-
-> Scalable Vector Graphics (SVG)
-
-Common technical abbreviations such as HTML, CSS, SVG, API, and URL do not need to be expanded when the intended audience can reasonably be expected to know them.
-
-Avoid Latin abbreviations such as:
-
-- e.g.
-- i.e.
-- etc.
-
-Prefer:
-
-- for example
-- that is
-- and so on
-
-## Use examples deliberately
-
-Use examples when they clarify how to apply a rule.
-
-Keep examples focused on the rule being demonstrated. Avoid introducing unrelated differences that make the comparison harder to understand.
-
-When contrasting examples, use **Do** and **Don't** consistently.
-
-**Do:**
-
-> Use one path for a continuous outline.
-
-**Don't:**
-
-> Split a continuous outline into several overlapping paths.
-
-The explanatory text should describe the principle, not merely narrate what is visible in the example.
-
-## Use links descriptively
-
-Link text should describe the destination or concept.
-
-**Do:**
-
-> See the [Icon Design Specification](./specification) for exact dimensions and spacing requirements.
-
-**Don't:**
-
-> For more information, [click here](./specification).
-
-Avoid generic link text such as:
-
-- click here
-- here
-- this page
-- learn more
-
-when a descriptive label is possible.
-
-## Avoid unnecessary repetition
-
-Do not repeat information already established by a heading, example, or immediately preceding sentence.
-
-**Prefer:**
-
-> ## Keep 1 pixel of safe space
->
-> Keep all artwork within the 22 × 22 pixel live area.
-
-**Over:**
-
-> ## Keep 1 pixel of safe space
->
-> When designing an icon, you should keep 1 pixel of safe space around the icon.
-
-Cross-reference another section instead of duplicating detailed rules that already have a canonical explanation.
-
-## Use contractions in prose
-
-Use natural contractions such as:
-
-- don't
-- can't
-- isn't
-- it's
-- you'll
-
-They make explanatory prose less formal and easier to scan.
-
-Use uncontracted forms when deliberate emphasis is useful.
-
-> Do not change existing icon geometry solely to reduce the number of SVG nodes.
-
-Normative statements using **must not** should not be contracted.
-
-## Use the serial comma
-
-Use the serial (Oxford) comma in lists of three or more items.
-
-**Do:**
-
-> Check the icon's size, stroke width, and spacing.
-
-**Don't:**
-
-> Check the icon's size, stroke width and spacing.
-
-## Use punctuation normally in prose
-
-Use periods for complete sentences.
-
-Periods may be omitted from:
-
-- headings
-- short labels
-- short list items that are not complete sentences
-- captions consisting only of a short phrase
-
-Be consistent within a list.
-
-If list items are complete sentences, end them with periods. If they are fragments, generally omit periods.
-
-## Skip colons in headings
-
-Do not end headings with colons.
-
-**Do:**
-
-> ## Naming conventions
-
-**Don't:**
-
-> ## Naming conventions:
-
-Use a colon normally when introducing a list or explanation in body text.
-
-## Use exclamation points sparingly
-
-Avoid exclamation points in technical documentation unless the context genuinely calls for excitement or celebration.
-
-**Prefer:**
-
-> Your first icon is ready.
-
-**Over:**
-
-> Your first icon is ready!
-
-Do not use exclamation points to make instructions sound friendlier.
-
-## Use ellipses only when they have meaning
-
-Use an ellipsis (`…`) to represent omitted content or an intentionally incomplete statement.
-
-Do not use ellipses decoratively or to make prose sound conversational.
-
-When documenting literal UI text, preserve the punctuation used by the interface.
-
-## Use parentheses for definitions and compact clarification
-
-Use parentheses when they make a definition, abbreviation, or short clarification easier to understand.
-
-> Scalable Vector Graphics (SVG)
-
-Avoid using parentheses for long side notes. Rewrite important information as part of the sentence or as a separate sentence.
-
-## Prefer "and" over ampersands
-
-Use **and** in normal prose.
-
-**Do:**
-
-> Naming and metadata
-
-**Avoid:**
-
-> Naming & metadata
-
-Use an ampersand only when it is part of an official name, literal UI text, code, or another established term.
-
-## Avoid em dashes
-
-Prefer commas, periods, colons, or parentheses when they produce a simpler sentence.
-
-**Prefer:**
-
-> This rule has one exception: existing legacy icons.
-
-**Avoid:**
-
-> This rule has one exception — existing legacy icons.
-
-Use an en dash (`–`) without surrounding spaces for ranges.
-
-> 1–3 pixels
-
-> A–Z
-
-Do not substitute a hyphen for an en dash in prose ranges unless required by a technical syntax.
-
-## Use hyphens correctly
-
-Hyphenate compound modifiers when necessary for clarity.
-
-> 24 × 24 pixel canvas
-
-> 2-pixel-wide gap
-
-> pixel-aligned element
-
-Do not hyphenate a phrase when it functions as a verb.
-
-> Sign off on the design.
-
-> Complete the sign-off.
-
-Do not add hyphens mechanically when the meaning is already clear.
-
-## Use code formatting consistently
-
-Use backticks for literal technical values and identifiers, including:
-
-- filenames and paths
-- commands
-- package names
-- properties and attributes
-- icon names
-- code values
-- SVG elements and attributes
-
-**Do:**
-
-> Add `camera-off` as an alias.
-
-> Set `stroke-width` to `2`.
-
-> Edit `icons/camera.svg`.
-
-Do not use code formatting merely for emphasis.
-
-## Use bold for semantic emphasis
-
-Use **bold** sparingly to highlight a term or distinction that helps readers scan the page.
-
-Do not bold entire sentences or paragraphs.
-
-Prefer bold over italics for general emphasis.
-
-Use *italics* only when conventional, such as when referring to a term as a term or when a specific distinction benefits from it.
-
-## Don't use all caps for emphasis
-
-Do not use blocks of uppercase text for emphasis.
-
-**Don't:**
-
-> NEVER place nodes outside the canvas.
-
-**Do:**
-
-> **Never** place nodes outside the canvas.
-
-Preserve capitalization when documenting literal identifiers or established technical terms.
-
-## Keep lists parallel
-
-Items in the same list should use the same grammatical structure.
-
-**Do:**
-
-- Use a 24 × 24 pixel canvas
-- Keep 1 pixel of safe space
-- Use a 2 pixel stroke
-- Align nodes to the pixel grid
-
-**Don't:**
-
-- Use a 24 × 24 pixel canvas
-- Safe space should be 1 pixel
-- A 2 pixel stroke
-- Nodes are aligned to the pixel grid
-
-Parallel structure makes rules easier to scan and compare.
-
-## Avoid unnecessary filler and enthusiasm
-
-Lucide documentation should sound helpful and confident, not promotional.
-
-Avoid filler such as:
-
-- "Simply…"
-- "Just…"
-- "Obviously…"
-- "Of course…"
-- "Easy…"
-- "Luckily…"
-- "Don't worry…"
-
-These words can be inaccurate or dismissive when the task is not simple for the reader.
-
-Also avoid marketing language such as:
-
-- "powerful"
-- "seamless"
-- "effortless"
-- "amazing"
-- "best-in-class"
-
-unless the word communicates a specific, verifiable distinction.
-
-## Prefer timeless documentation
-
-Avoid wording tied unnecessarily to the current state of development.
-
-**Prefer:**
-
-> Lucide supports custom icon aliases.
-
-**Avoid:**
-
-> Lucide now supports custom icon aliases.
-
-Use time-sensitive language only when the timing itself matters, such as migration notes, deprecations, or release documentation.
-
-## Preserve established Lucide terminology
-
-When editing existing documentation, preserve established Lucide terminology and naming conventions unless there is a clear reason to change them.
-
-Do not invent synonyms merely to avoid repetition. Consistency is more important than stylistic variety in technical documentation.
-
-When terminology differs between the Lucide codebase, API, UI, and documentation, prefer the term used by the relevant canonical specification.

.github/labeler.yml

@@ -30,11 +30,6 @@
       - any-glob-to-any-file:
           - 'icons/*.svg'
 
-🔬 Lab icon:
-  - changed-files:
-      - any-glob-to-any-file:
-          - 'lab/*.svg'
-
 # For changes in the lucide package
 🧳 lucide package:
   - changed-files:

.github/workflows/ci.yml

@@ -102,7 +102,7 @@ jobs:
           echo '${{ steps.change-log.outputs.CHANGE_LOG }}'
 
       - name: Create Release
-        uses: softprops/action-gh-release@efb35369e0ad2afab669f228072c1b0d510eae64 # v3.0.3
+        uses: softprops/action-gh-release@3d0d9888cb7fd7b750713d6e236d1fcb99157228 # v3.0.2
         with:
           tag_name: ${{ steps.new-version.outputs.NEW_VERSION }}
           name: Version ${{ steps.new-version.outputs.NEW_VERSION }}

.github/workflows/lucide-lab.yml

@@ -3,7 +3,6 @@ name: Lucide Lab checks
 on:
   pull_request:
     paths:
-      - lab/**
       - packages/lab/**
       - packages/shared/**
       - tools/build-icons/**

.github/workflows/lucide-react.yml

@@ -7,13 +7,10 @@ on:
   pull_request:
     paths:
       - packages/lucide-react/**
-      - integrations/lucide-react/**
       - packages/shared/**
       - tools/build-icons/**
       - tools/rollup-plugins/**
       - scripts/generateNextJSAliases.mjs
-      - package.json
-      - pnpm-workspace.yaml
       - pnpm-lock.yaml
 
 permissions:
@@ -51,22 +48,3 @@ jobs:
 
       - name: Test
         run: pnpm --filter lucide-react test
-
-  integration:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-      - uses: pnpm/action-setup@0977fd99725f1db4007ccb2928dbb4e90d06cc86 # v6.0.10
-      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-        with:
-          cache: 'pnpm'
-          node-version-file: 'package.json'
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      - name: Install Chromium
-        run: pnpm --filter @lucide/integration-react-vite exec playwright install --with-deps chromium
-
-      - name: Run integration checks
-        run: pnpm test:integrations:react

.github/workflows/release-lab.yml

@@ -1,146 +0,0 @@
-name: Release @lucide/lab
-
-on:
-  push:
-    branches:
-      - main
-    paths:
-      - lab/**/*.svg
-
-  workflow_dispatch:
-    inputs:
-      release-type:
-        description: Release type
-        required: true
-        default: 'minor'
-        type: choice
-        options:
-          - patch
-          - minor
-          - major
-
-permissions: {}
-
-jobs:
-  create-release:
-    if: github.repository == 'lucide-icons/lucide'
-    runs-on: ubuntu-latest
-    permissions:
-      contents: write # Required to create the release and tag
-    outputs:
-      VERSION: ${{ steps.new-version.outputs.NEW_VERSION }}
-      SHOULD_RELEASE: ${{ steps.release-notes.outputs.SHOULD_RELEASE }}
-    steps:
-      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-        with:
-          fetch-depth: 0 # Required to diff the lab icons against the previous tag
-
-      - uses: pnpm/action-setup@0977fd99725f1db4007ccb2928dbb4e90d06cc86 # v6.0.10
-      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-        with:
-          cache: 'pnpm'
-          node-version-file: 'package.json'
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      - name: Get latest tag
-        id: latest-tag
-        run: |
-          LATEST_TAG=$(git tag --list '@lucide/lab@*' --sort=-v:refname | head -n 1)
-
-          if [ -z "$LATEST_TAG" ]; then
-            echo "::error::No @lucide/lab@* tag found to release from."
-            exit 1
-          fi
-
-          echo "Latest tag: $LATEST_TAG"
-          echo "LATEST_TAG=$LATEST_TAG" >> $GITHUB_OUTPUT
-
-      - name: Create new version
-        id: new-version
-        run: |
-          NEW_VERSION=$(pnpm semver "${LATEST_TAG#@lucide/lab@}" -i "$RELEASE_TYPE")
-
-          echo "New version: $NEW_VERSION"
-          echo "NEW_VERSION=$NEW_VERSION" >> $GITHUB_OUTPUT
-        env:
-          LATEST_TAG: ${{ steps.latest-tag.outputs.LATEST_TAG }}
-          RELEASE_TYPE: ${{ inputs.release-type || 'minor' }}
-
-      - name: Generate release notes
-        id: release-notes
-        run: |
-          NEW_TAG="@lucide/lab@$NEW_VERSION"
-
-          ADDED=$(git diff --name-only --diff-filter=A "$LATEST_TAG" HEAD -- 'lab/*.svg' \
-            | xargs -r -n1 basename | sed 's/\.svg$//' | sort)
-          REMOVED=$(git diff --name-only --diff-filter=D "$LATEST_TAG" HEAD -- 'lab/*.svg' \
-            | xargs -r -n1 basename | sed 's/\.svg$//' | sort)
-
-          if [ -z "$ADDED" ] && [ "$EVENT_NAME" != 'workflow_dispatch' ]; then
-            echo "::notice::No icons were added to ./lab since $LATEST_TAG, skipping release."
-            echo "SHOULD_RELEASE=false" >> $GITHUB_OUTPUT
-            exit 0
-          fi
-
-          {
-            if [ -n "$ADDED" ]; then
-              printf '## New icons\n\n'
-              printf '%s\n' "$ADDED" | sed 's|.*|- `&`|'
-              printf '\n'
-            fi
-
-            if [ -n "$REMOVED" ]; then
-              printf '## Removed icons\n\nThese graduated to the core icon set.\n\n'
-              printf '%s\n' "$REMOVED" | sed 's|.*|- `&`|'
-              printf '\n'
-            fi
-
-            printf '**Full changelog**: https://github.com/lucide-icons/lucide/compare/%s...%s\n' "$LATEST_TAG" "$NEW_TAG"
-          } > lab-release-notes.md
-
-          cat lab-release-notes.md
-          echo "SHOULD_RELEASE=true" >> $GITHUB_OUTPUT
-        env:
-          LATEST_TAG: ${{ steps.latest-tag.outputs.LATEST_TAG }}
-          NEW_VERSION: ${{ steps.new-version.outputs.NEW_VERSION }}
-          EVENT_NAME: ${{ github.event_name }}
-
-      - name: Create Release
-        if: steps.release-notes.outputs.SHOULD_RELEASE == 'true'
-        uses: softprops/action-gh-release@efb35369e0ad2afab669f228072c1b0d510eae64 # v3.0.3
-        with:
-          tag_name: '@lucide/lab@${{ steps.new-version.outputs.NEW_VERSION }}'
-          name: '@lucide/lab@${{ steps.new-version.outputs.NEW_VERSION }}'
-          body_path: lab-release-notes.md
-          make_latest: 'false' # Never displace the core icon release as "Latest"
-
-  publish:
-    if: github.repository == 'lucide-icons/lucide' && needs.create-release.outputs.SHOULD_RELEASE == 'true'
-    runs-on: ubuntu-latest
-    needs: create-release
-    permissions:
-      id-token: write # Required for OIDC (npm provenance)
-      contents: read
-    steps:
-      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
-      - uses: pnpm/action-setup@0977fd99725f1db4007ccb2928dbb4e90d06cc86 # v6.0.10
-      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-        with:
-          cache: 'pnpm'
-          node-version-file: 'package.json'
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      - name: Set new version
-        run: pnpm version ${{ needs.create-release.outputs.VERSION }} --filter @lucide/lab --fail-if-no-match --no-git-tag-version
-
-      - name: Build
-        run: pnpm --filter @lucide/lab build
-
-      - name: Publish
-        run: pnpm --filter @lucide/lab publish --access public --no-git-checks --ignore-scripts --tag latest
-        env:
-          NPM_CONFIG_PROVENANCE: true

.github/workflows/release.yml

@@ -169,7 +169,7 @@ jobs:
           zip -r lucide-icons-${{ needs.prepare.outputs.VERSION }}.zip icons
 
       - name: Release zip and fonts
-        uses: softprops/action-gh-release@efb35369e0ad2afab669f228072c1b0d510eae64 # v3.0.3
+        uses: softprops/action-gh-release@3d0d9888cb7fd7b750713d6e236d1fcb99157228 # v3.0.2
         with:
           tag_name: ${{ needs.prepare.outputs.VERSION }}
 

.gitignore

@@ -6,7 +6,6 @@
 .cache
 .env
 node_modules
-.pnpm-store
 dist
 build
 sandbox
@@ -14,10 +13,6 @@ stash
 coverage
 stats
 *.log
-*.tsbuildinfo
-integrations/**/.react-router
-integrations/**/.vitest-attachments
-integrations/**/__screenshots__
 outlined
 lucide-font
 packages/**/src/icons/*.js
@@ -28,9 +23,6 @@ packages/**/src/aliases.ts
 !packages/**/src/aliases/index.ts
 packages/**/src/utils/*.ts
 !packages/shared/src/utils/*.ts
-!packages/shared/src/build/
-!packages/shared/src/build/*.ts
-packages/shared/src/build/types.d.ts
 packages/**/src/dynamicIconImports.ts
 packages/**/DynamicIcon.d.ts
 packages/**/dynamicIconImports.js

.prettierignore

@@ -19,13 +19,6 @@ packages/lucide-static/icon-nodes.json
 packages/lucide-static/font
 packages/svelte/.svelte-kit
 
-# integration test artifacts and generated routes
-integrations/**/.react-router
-integrations/**/next-env.d.ts
-integrations/**/routeTree.gen.ts
-integrations/**/.vitest-attachments
-integrations/**/__screenshots__
-
 # lucide-svelte
 packages/svelte/src/icons/*.svelte
 packages/svelte/.svelte-kit

docs/.vitepress/config.ts

@@ -4,7 +4,6 @@ import { groupIconMdPlugin, groupIconVitePlugin } from 'vitepress-plugin-group-i
 import sidebar from './sidebar';
 import snackPlayer from './markdown/snackPlayer';
 import sandpackPlugin from './markdown/sandpack';
-import examplePlugin from './markdown/example';
 import { readFile } from 'node:fs/promises';
 import { resourcesSidebar } from './sidebar/resources';
 import llmstxt from 'vitepress-plugin-llms';
@@ -32,7 +31,6 @@ export default defineConfig({
     config(md) {
       md.use(groupIconMdPlugin);
       md.use(snackPlayer);
-      md.use(examplePlugin);
       md.use(sandpackPlugin, {
         defaultFiles: {
           '/styles.css': {
@@ -98,7 +96,7 @@ export default defineConfig({
         text: 'Resources',
         items: [
           ...resourcesSidebar[0].items,
-          { text: 'Contributing icons', link: '/contribute/icons/' },
+          { text: 'Design icons', link: '/contribute/icon-design-guide' },
         ],
       },
       { text: 'Packages', link: '/packages' },

docs/.vitepress/markdown/example.ts

@@ -1,204 +0,0 @@
-import { readFileSync } from 'node:fs';
-import { dirname, isAbsolute, resolve } from 'node:path';
-import type MarkdownIt from 'markdown-it';
-import type { RenderRule } from 'markdown-it/lib/renderer.mjs';
-import container from 'markdown-it-container';
-
-type ContainerArgs = [typeof container, string, { render: RenderRule }];
-
-const parseInfo = (info: string, marker: string) => info.trim().slice(marker.length).trim();
-
-const stripWrappingQuotes = (value: string) => {
-  const quote = value[0];
-
-  if ((quote === '"' || quote === "'") && value.at(-1) === quote) {
-    return value.slice(1, -1);
-  }
-
-  return value;
-};
-
-const isRawSvgUrl = (url: string) => {
-  const [filePath, query = ''] = url.split('?');
-  const params = new URLSearchParams(query);
-
-  return filePath.endsWith('.svg') && params.get('raw') === 'true';
-};
-
-const isImageUrl = (value: string) => {
-  const [filePath] = value.split('?');
-
-  return /\.(avif|gif|jpe?g|png|svg|webp)$/i.test(filePath);
-};
-
-const resolveMarkdownPath = (env: Record<string, unknown>) =>
-  (env.path as string | undefined) ??
-  (env.file as string | undefined) ??
-  (env.realPath as string | undefined);
-
-const renderImage = (
-  url: string,
-  env: Record<string, unknown>,
-  escapeAttr: (value: string) => string,
-) => {
-  if (!isRawSvgUrl(url)) {
-    return `<img class="example-guidance__image" src="${escapeAttr(url)}" alt="" loading="lazy">`;
-  }
-
-  const [filePath] = url.split('?');
-  const markdownPath = resolveMarkdownPath(env);
-  const resolvedPath = isAbsolute(filePath)
-    ? resolve(process.cwd(), `.${filePath}`)
-    : resolve(markdownPath ? dirname(markdownPath) : process.cwd(), filePath);
-  const svg = readFileSync(resolvedPath, 'utf8');
-  const replacedSvg = svg
-    .replaceAll(/(#000(000)?|black)/g, 'currentColor')
-    .replaceAll(' stroke="#D8D8D9"', 'style="stroke: currentColor; stroke-opacity: .25;"');
-
-  return `<div class="example-guidance__image example-guidance__image--raw">${replacedSvg}</div>`;
-};
-
-const renderPreview = (
-  value: string,
-  env: Record<string, unknown>,
-  escapeHtml: (value: string) => string,
-  renderInline: (value: string) => string,
-) => {
-  if (isImageUrl(value)) {
-    return renderImage(value, env, escapeHtml);
-  }
-
-  return `<div class="example-guidance__text">${renderInline(value)}</div>`;
-};
-
-const hasTopLevelContent = (tokens: Parameters<RenderRule>[0], index: number) => {
-  let guidanceDepth = 0;
-
-  for (let i = index + 1; i < tokens.length; i += 1) {
-    const token = tokens[i];
-
-    if (token.type === 'container_example_close') {
-      return false;
-    }
-
-    if (token.type === 'container_do_open' || token.type === 'container_dont_open') {
-      guidanceDepth += 1;
-      continue;
-    }
-
-    if (token.type === 'container_do_close' || token.type === 'container_dont_close') {
-      guidanceDepth -= 1;
-      continue;
-    }
-
-    if (guidanceDepth === 0) {
-      return true;
-    }
-  }
-
-  return false;
-};
-
-const hasGuidance = (tokens: Parameters<RenderRule>[0], index: number) => {
-  for (let i = index + 1; i < tokens.length; i += 1) {
-    const token = tokens[i];
-
-    if (token.type === 'container_example_close') {
-      return false;
-    }
-
-    if (token.type === 'container_do_open' || token.type === 'container_dont_open') {
-      return true;
-    }
-  }
-
-  return false;
-};
-
-const isFirstGuidance = (tokens: Parameters<RenderRule>[0], index: number) => {
-  for (let i = index - 1; i >= 0; i -= 1) {
-    const token = tokens[i];
-
-    if (token.type === 'container_example_open') {
-      return true;
-    }
-
-    if (token.type === 'container_do_open' || token.type === 'container_dont_open') {
-      return false;
-    }
-  }
-
-  return true;
-};
-
-const getExampleOpenIndex = (tokens: Parameters<RenderRule>[0], index: number) => {
-  for (let i = index; i >= 0; i -= 1) {
-    if (tokens[i].type === 'container_example_open') {
-      return i;
-    }
-  }
-
-  return index;
-};
-
-export default function examplePlugin(md: MarkdownIt) {
-  const escapeHtml = md.utils.escapeHtml;
-
-  const createExampleContainer = (): ContainerArgs => [
-    container,
-    'example',
-    {
-      render(tokens, idx) {
-        const token = tokens[idx];
-
-        if (token.nesting === 1) {
-          const hasContent = hasTopLevelContent(tokens, idx);
-          const guidanceOnlyClass = hasContent ? '' : ' example-block--guidance-only';
-          const contentOpen = hasContent ? '<div class="example-block__content">\n' : '';
-
-          return `<section class="example-block${guidanceOnlyClass}">\n${contentOpen}`;
-        }
-
-        const exampleOpenIndex = getExampleOpenIndex(tokens, idx);
-        const contentClose =
-          hasTopLevelContent(tokens, exampleOpenIndex) && !hasGuidance(tokens, exampleOpenIndex)
-            ? '</div>\n'
-            : '';
-
-        return `${contentClose}</section>\n`;
-      },
-    },
-  ];
-
-  const createGuidanceContainer = (type: 'do' | 'dont'): ContainerArgs => [
-    container,
-    type,
-    {
-      render(tokens, idx, _options, env) {
-        const token = tokens[idx];
-
-        if (token.nesting === 1) {
-          const exampleOpenIndex = getExampleOpenIndex(tokens, idx);
-          const preview = stripWrappingQuotes(parseInfo(token.info, type));
-          const media = renderPreview(preview, env, escapeHtml, md.renderInline.bind(md));
-          const contentClose =
-            hasTopLevelContent(tokens, exampleOpenIndex) && isFirstGuidance(tokens, idx)
-              ? '</div>\n'
-              : '';
-          const label =
-            type === 'do'
-              ? `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check-icon lucide-check"><path d="M20 6 9 17l-5-5"/></svg> Do`
-              : `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg> Don't`;
-
-          return `${contentClose}<figure class="example-guidance example-guidance--${type}">${media}<figcaption class="example-guidance__caption"><div class="example-guidance__label">${label}</div>\n`;
-        }
-
-        return '</figcaption></figure>\n';
-      },
-    },
-  ];
-
-  md.use(...createExampleContainer());
-  md.use(...createGuidanceContainer('do'));
-  md.use(...createGuidanceContainer('dont'));
-}

docs/.vitepress/sidebar/resources.ts

@@ -11,91 +11,41 @@ export const resourcesSidebar = [
         link: '/community',
       },
       {
-        text: 'Code of conduct',
+        text: 'Code of Conduct',
         link: '/code-of-conduct',
       },
       {
         text: 'Brand logo statement',
         link: '/brand-logo-statement',
       },
-    ],
-  },
-  {
-    text: 'Contribute',
-    items: [
       {
-        text: 'Contribution guide',
-        link: '/contribute/',
+        text: 'Contributing',
+        link: '/contribute',
       },
     ],
   },
   {
-    text: 'Contributing icons',
+    text: 'Designing icons',
     items: [
       {
-        text: 'Getting started',
-        link: '/contribute/icons/',
+        text: 'Icon Design Principles',
+        link: '/contribute/icon-design-guide',
       },
       {
-        text: 'Design language',
-        link: '/contribute/icons/design-principles',
-        desc: 'Learn the visual principles that shape Lucide icons with side-by-side examples.',
+        text: 'Designing in Illustrator',
+        link: '/contribute/illustrator-guide',
       },
       {
-        text: 'Design specification',
-        link: '/contribute/icons/specification',
-        desc: 'Review the technical requirements every Lucide icon must meet.',
+        text: 'Designing in Inkscape',
+        link: '/contribute/inkscape-guide',
       },
       {
-        text: 'Naming conventions',
-        link: '/contribute/icons/naming-conventions',
-        desc: 'Learn how to choose clear, consistent, and predictable names for Lucide icons.',
+        text: 'Designing in Figma',
+        link: '/contribute/figma-guide',
       },
       {
-        text: 'Metadata conventions',
-        link: '/contribute/icons/metadata-conventions',
-        desc: 'Learn how to write use cases, tags, categories, aliases, and other icon metadata.',
-        items: [
-          {
-            text: 'Use case guide',
-            link: '/contribute/icons/metadata-conventions/use-case-guide',
-            desc: '',
-          },
-          {
-            text: 'Tag guide',
-            link: '/contribute/icons/metadata-conventions/tag-guide',
-            desc: '',
-          },
-        ],
-      },
-      {
-        text: 'SVG conventions',
-        link: '/contribute/icons/code-conventions',
-        desc: 'Learn how to structure and write Lucide SVG files.',
-      },
-      {
-        text: 'Design software guides',
-        collapsed: false,
-        desc: 'Learn how to design and export Lucide icons with common vector tools.',
-        items: [
-          {
-            text: 'Adobe Illustrator',
-            link: '/contribute/icons/illustrator-guide',
-            desc: '',
-          },
-          {
-            text: 'Inkscape',
-            link: '/contribute/icons/inkscape-guide',
-          },
-          {
-            text: 'Figma',
-            link: '/contribute/icons/figma-guide',
-          },
-          {
-            text: 'Affinity Designer',
-            link: '/contribute/icons/affinity-designer-guide',
-          },
-        ],
+        text: 'Designing in Affinity Designer',
+        link: '/contribute/affinity-designer-guide',
       },
     ],
   },

docs/.vitepress/theme/style.css

@@ -183,140 +183,3 @@ html {
   background: transparent;
   border: none;
 }
-
-.custom-block.success {
-  border-color: transparent;
-  color: var(--vp-c-text-1);
-  background-color: var(--vp-c-success-soft);
-}
-/* Example guidance blocks */
-.example-block {
-  margin: 32px 0;
-}
-
-.example-block__title {
-  margin: 0 0 12px;
-  font-size: 20px;
-  line-height: 1.4;
-}
-
-.example-block > :first-child {
-  margin-top: 0;
-}
-
-.example-block > :last-child {
-  margin-bottom: 0;
-}
-
-.example-block__content > :first-child {
-  margin-top: 0;
-}
-
-.example-block__content > :last-child {
-  margin-bottom: 0;
-}
-
-.example-guidance__image {
-  display: block;
-  width: 100%;
-  height: auto;
-  background-color: var(--vp-c-bg-soft);
-  border-bottom: 4px solid var(--vp-c-divider);
-  border-top-left-radius: 16px;
-  border-top-right-radius: 16px;
-  overflow: hidden;
-}
-
-.example-guidance__image--raw svg {
-  display: block;
-  width: 100%;
-  height: auto;
-}
-
-.example-guidance__text {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  align-items: center;
-  justify-content: center;
-  min-height: 160px;
-  padding: 24px;
-  background-color: var(--vp-c-bg-alt);
-  border-bottom: 1px solid var(--vp-c-divider);
-  border-top-left-radius: 16px;
-  border-top-right-radius: 16px;
-  color: var(--vp-c-text-1);
-  font-size: 20px;
-  line-height: 1.4;
-  text-align: center;
-  text-wrap: balance;
-}
-
-.example-guidance__text svg.lucide {
-  flex-shrink: 0;
-  display: inline-block;
-  vertical-align: -6px;
-}
-
-.example-guidance__caption {
-  color: var(--vp-c-text-1);
-}
-
-.example-guidance__caption > p {
-  margin: 0;
-  padding: 0 16px 16px;
-}
-
-.example-guidance__label {
-  display: flex;
-  gap: 8px;
-  padding: 12px;
-  margin: 0 0 16px;
-  background-color: var(--example-guidance-label-bg);
-  color: var(--vp-c-neutral-inverse);
-  border-bottom-left-radius: 16px;
-  border-bottom-right-radius: 16px;
-}
-
-.example-guidance--do {
-  --example-guidance-label-bg: var(--vp-c-success-1);
-}
-
-.example-guidance--dont {
-  --example-guidance-label-bg: var(--vp-c-danger-1);
-}
-
-@media (min-width: 640px) {
-  .example-block {
-    display: grid;
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-    gap: 24px;
-  }
-
-  .example-block__content {
-    grid-column: 1 / -1;
-  }
-
-  .example-guidance {
-    margin: 0;
-  }
-}
-
-@media (min-width: 960px) {
-  .example-block {
-    grid-template-columns: minmax(0, 0.9fr) repeat(2, minmax(0, 1fr));
-  }
-
-  .example-block--guidance-only {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-
-  .example-block__content {
-    grid-column: 1;
-  }
-
-  .example-guidance {
-    grid-column: auto;
-    grid-row: auto;
-  }
-}

docs/community.md

@@ -29,7 +29,7 @@ Contribution in form of code or new icons is always welcome, but you can also he
 
 ### Design New Icons
 
-If you have design skills, consider contributing new icons to the Lucide library. Check out our [icon design guide](/contribute/icons/design-principles.md) for tips and guidelines on creating icons that fit the Lucide style.
+If you have design skills, consider contributing new icons to the Lucide library. Check out our [icon design guide](/contribute/icon-design-guide.md) for tips and guidelines on creating icons that fit the Lucide style.
 
 ### Contribute Code
 

docs/contribute/affinity-designer-guide.md

@@ -0,0 +1,18 @@
+---
+title: Affinity Designer Template Guide
+---
+
+# Affinity Designer Template Guide
+
+This guide describes how to use the Affinity Designer template for Lucide.
+
+## General Workflow
+
+>Attention: By default, Affinity Designer sets the unit for stroke to points. Make sure that it is set to pixel. To do this, open `Preferences > User Interface`. Under `Decimal Places for Unit Types`, uncheck `Show Lines in points`.
+
+1. Download and open the [Affinity Designer template](https://github.com/lucide-icons/lucide/blob/main/docs/public/templates/affinity_designer.aftemplate).
+2. Follow the [Icon Design Principles](icon-design-guide.md) while you use the template (to ensure integrity with the Lucide icon pack).
+3. Export the file as SVG (`File > Export`). Make sure that _Rastering_ is set to _Nothing_, _Export text as curves_ is checked (hopefully, you won't need this), _Use hex colors_ is checked, and _Flatten transforms_ is checked.
+
+	 ![SVG export options in Affinity Designer](../images/affinity-designer-export-options.png?raw=true)
+4. Optimize the exported SVG file further with [SVGOMG](https://jakearchibald.github.io/svgomg/) or [`svgo`](https://github.com/svg/svgo) (using `svgo --multipass exported_icon.svg`).

docs/contribute/figma-guide.md

@@ -0,0 +1,51 @@
+---
+title: Figma Template Guide
+---
+
+# Figma Template Guide
+
+This guide shows the steps to setup Figma for creating icons that conform to the Featherity design guidelines.
+
+## Setting Up The Frame
+When you create a new document in Figma, the document. Each individual icon you want to create, has to be created in a separate frame.
+
+To do this, create a frame of 24x24 pixels.
+
+1. Click the frame button (or press `F`)
+2. Draw a 24x24 frame (or edit it afterwards from the design window)
+
+In this newly created frame, you will create your icon. If you want, you can change the name of your frame to the name of the icon you are going to create. Then it will be exported as `FRAME-NAME.svg`.
+
+## Create Your icon
+To design your icon in the style of Feather Icons, you need to adjust a few settings in Figma.
+
+Draw in your new frame with the pen tool. You can open it with the window at the top, or with the shortcut `P`. Once you click in your frame, you can adjust the settings for the pen tool in the design-window on the right.
+
+Set the following:
+1. Vector
+   1. Corner radius: 2px
+2. Stroke
+   1. Stroke width: 2px
+   2. Stroke alignment: center
+
+![Figma Stroke Options](../images/figma-stroke-options.png)
+
+## Export Or Copy Your Icon
+Once you have completed your icon, you can export it.
+
+1. Select the frame
+2. Open the *Export* tab on the right
+3. Set the file type as SVG
+4. Press export
+
+Or you can also copy its source as SVG.
+
+1. Select the frame
+2. Right click it
+3. Click on *Copy/Paste as*
+4. Click on *Copy as SVG*
+
+That's it. You just made your first icon. Congratulations!
+
+## Figma Tips
+1. The [Icon Design Guidelines](icon-design-guide.md) dictate that you keep 2px spacing between detached elements. In Figma, you can easily check this with: `⌥` Option (MacOS) or `Alt` (Windows).

docs/contribute/icon-design-guide.md

@@ -0,0 +1,199 @@
+---
+description: Guidelines and best practices for designing icons for the Lucide icon library.
+---
+# Icon Design Guide
+
+Guidelines and best practices for designing icons for the Lucide icon library.
+
+## Icon Design Principles
+
+Here are rules that should be followed to keep quality and consistency when making icons for Lucide.
+
+### 1. Icons must be designed on a **24 by 24 pixels** canvas.
+
+![24px-24px](../images/24px-24px.svg?raw=true "24px-24px")
+
+### 2. Icons must have at least **1 pixel padding** within the canvas.
+
+![1px-padding](../images/1px-padding.svg?raw=true "1px-padding")
+
+### 3. Icons must have a **stroke width of 2 pixels**.
+
+![2px-stroke](../images/2px-stroke.svg?raw=true "2px-stroke")
+
+### 4. Icons must use **round joins**.
+
+![round-joints](../images/round-joints.svg?raw=true "round-joints")
+
+### 5. Icons must use **round caps**.
+
+![round-caps](../images/round-caps.svg?raw=true "round-caps")
+
+### 6. Icons must use **centered strokes**.
+
+![centered-strokes](../images/centered-strokes.svg?raw=true "centered-strokes")
+
+### 7. Shapes (such as rectangles) must have a **border radius of**
+
+#### A. **2 pixels** if they are at least 8 pixels in size
+
+![2px-border-radius](../images/2px-border-radius.svg?raw=true "2px-border-radius")
+
+#### B. **1 pixel** if they are smaller than 8 pixels in size
+
+![1px-border-radius](../images/1px-border-radius.svg?raw=true "1px-border-radius")
+
+### 8. Distinct elements must have **2 pixels of spacing between each other**
+
+![2px-element-spacing](../images/2px-element-spacing.svg?raw=true '2px-element-spacing')
+
+![2px-element-spacing-connected](../images/2px-element-spacing-connected.svg?raw=true '2px-element-spacing-connected')
+
+![2px-element-spacing-abrupt-cut](../images/2px-element-spacing-abrupt-cut.svg?raw=true '2px-element-spacing-abrupt-cut')
+
+### 9. Icons should have a similar optical volume to `circle` and `square`.
+
+![optical-volume-ideal](../images/optical-volume-ideal.svg?raw=true "optical-volume-ideal")
+
+![optical-volume-low](../images/optical-volume-low.svg?raw=true "optical-volume-low")
+
+![optical-volume-high](../images/optical-volume-high.svg?raw=true "optical-volume-high")
+
+**Tip:** place your icon next to the circle or square icon and blur them both; your icon should not feel much darker than the base shape.
+
+### 10. Icons should be visually centered by their center of gravity.
+
+![visually-centered](../images/visually-centered.svg?raw=true "visually-centered")
+
+![visually-centered-bad](../images/visually-centered-bad.svg?raw=true "visually-centered-bad")
+
+**Tip:** place your icon both above/below and next to the square or circle icon and check if it feels off center. Symmetrical icons should always be aligned to the center.
+
+### 11. Icons should have similar visual density and level of detail.
+
+![density-ideal](../images/density-ideal.svg?raw=true "density-ideal")
+
+![density-high](../images/density-high.svg?raw=true "density-high")
+
+**Tip:** try to make abstractions to dense elements. Blur your icon, and when blurred it should not feel overly dark.
+
+### 12. Continuous curves should join smoothly.
+
+![curvature-smooth](../images/curvature-smooth.svg?raw=true "curvature-smooth")
+
+![curvature-uneven](../images/curvature-uneven.svg?raw=true "curvature-uneven")
+
+**Tip:** make sure to use arcs or quadratic curves. When using cubic curves control points should have mirrored angles for smooth curves.
+
+### 13. Icons should aim to be pixel perfect so that they will be sharp on low DPI displays.
+
+![pixel-perfection-ideal](../images/pixel-perfection-ideal.svg?raw=true "pixel-perfection-ideal")
+
+![pixel-perfection-bad](../images/pixel-perfection-bad.svg?raw=true "pixel-perfection-bad")
+
+**Tip:** whenever possible align elements and arc centers to the grid.
+
+### 14. Icons should share common shapes
+
+You should try to create consistent groups and variants, reuse and try to create uniformity.
+Consistency inside groups and variants has a lower priority than the rules above.
+
+**Example:** All `-off` icons should look the same unless it for example violates the optical volume rule.
+
+**Tip:** Try to not move the base shape to enable better use in a toggle context.
+
+## Naming conventions
+
+1. Icon names use lower kebab case.\
+   For example: `arrow-up` instead of `Arrow Up`.
+
+2. Icon names use International English names, as opposed to local variants.\
+   For example:  `color` instead of `colour`.
+
+3. Icons should be named for what they depict rather than their use case or what they represent.\
+   For example: `floppy-disk` instead of `save` and `circle-slash` rather than `ban`.
+
+4. Icons that are part of a group are named `<group>-<variant>`.\
+   For example: `badge-plus` is based on `badge`.
+
+5. Icon names for alternate icons should represent what makes the alternate unique instead of being numbered.\
+   For example: `send-horizontal` instead of `send-2`.
+
+6. Names containing numerals are not allowed, unless the number itself is represented in the icon.\
+   For example: `arrow-down-0-to-1` contains both numerals.
+
+7. Icons depicting multiple elements (e.g. a person and a circle) of different sizes must list these elements in decreasing order of size.\
+   For example: if the circle is bigger, it should be `circle-person`, if the person is bigger, it should be `person-circle`.
+
+8. Icons depicting multiple elements of roughly equal sizes (e.g. a `ruler` and a `pencil`) must list these elements front to back in case one element is in front of the other, otherwise in English reading order (top to bottom, left to right).\
+   For example: if the `pencil` is either in front of, above or left of `ruler`, it should be `pencil-ruler`, otherwise, it should be `ruler-pencil`.
+
+9. Icons depicting some sort of variation of an element must use the `[element]-[modifier]` naming scheme, with modifiers being applied to each element respectively.\
+   For example: a dashed circle must be named `circle-dashed`, not `dashed-circle`, and in coordination with the previous guidelines, a dashed circle containing a broken heart would be named `circle-dashed-heart-broken`, due to the heart being smaller than the circle.
+
+## Code Conventions
+
+Before an icon is added to the library, we like to have readable and optimized SVG code.
+
+### Global Attributes
+
+For each icon these attributes are applied, corresponding to the above rules.
+
+```xml
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <!-- SVGElements -->
+</svg>
+```
+
+### Minify paths
+
+The code of paths can sometimes get quite large. To reduce file size we like to minify the code.
+We recommend to use [Lucide Studio](https://studio.lucide.dev/?utm_source=lucide.dev&utm_medium=design-guide) to tidy paths to 3 points of precision.
+
+### Allowed elements
+
+SVG files may only contain simple path and shape elements, which may not have any attributes other than sizing and spacing.\
+In practice only the following elements and attributes are allowed:
+* `<path d>`
+* `<line x1 x2>`
+* `<polygon points>`
+* `<polyline points>`
+* `<circle cx cy r>`
+* `<ellipse cx cy rx ry>`
+* `<rect x y width height rx>`
+
+This also means that no transforms, filters, fills or explicit strokes are allowed.
+
+Never use [`<use>`](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/use). While it may sometimes seem like a good way to optimize file size, there's no way to ensure that the referenced element IDs will be unique once the SVGs are embedded in HTML documents.
+
+## JSON metadata descriptor
+
+Each icon added must also come with a matching JSON file listing tags and categories for the icon.
+Please use the following template:
+
+```json
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "github-username",
+    "another-github-username"
+  ],
+  "tags": [
+    "foo",
+    "bar"
+  ],
+  "categories": [
+    "devices"
+  ]
+}
+```

docs/contribute/icons/affinity-designer-guide.md

@@ -1,19 +0,0 @@
----
-description: Learn how to use the Affinity Designer template for Lucide.
----
-
-# Affinity Designer template guide
-
-This guide explains how to use the Affinity Designer template for Lucide.
-
-## Workflow
-
-> Affinity Designer uses points for strokes by default. Change strokes to pixels before drawing. Open `Preferences > User Interface`, then under `Decimal Places for Unit Types`, uncheck `Show Lines in points`.
-
-1. Download and open the [Affinity Designer template](https://github.com/lucide-icons/lucide/blob/main/docs/public/templates/affinity_designer.aftemplate).
-2. Follow the [design language](design-principles.md) while designing your icon.
-3. Export the file as SVG with `File > Export`. Set rasterization to _Nothing_, check _Export text as curves_, check _Use hex colors_, and check _Flatten transforms_.
-
-   ![SVG export options in Affinity Designer](../../images/affinity-designer-export-options.png?raw=true)
-
-4. Optimize the exported SVG with [Lucide Studio](https://studio.lucide.dev/).

docs/contribute/icons/code-conventions.md

@@ -1,91 +0,0 @@
----
-description: Learn about allowed SVG elements and attributes, optimization, and other code conventions.
----
-
-# SVG conventions
-
-Before you add an icon to Lucide, make sure its SVG is readable and optimized.
-
-## Global attributes
-
-Each icon uses these root SVG attributes:
-
-```xml
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="24"
-  height="24"
-  viewBox="0 0 24 24"
-  fill="none"
-  stroke="currentColor"
-  stroke-width="2"
-  stroke-linecap="round"
-  stroke-linejoin="round"
->
-  <!-- SVGElements -->
-</svg>
-```
-
-## Minify paths
-
-Path data can get large. Minify it to keep SVG files small.
-
-Use [Lucide Studio](https://studio.lucide.dev/?utm_source=lucide.dev&utm_medium=design-guide) to tidy paths to 3 decimal places.
-
-## Allowed elements
-
-SVG files may only contain simple path and shape elements. These elements may only use sizing and position attributes.
-
-Only these elements and attributes are allowed:
-
-- `<path d>`
-- `<line x1 y1 x2 y2>`
-- `<polygon points>`
-- `<polyline points>`
-- `<circle cx cy r>`
-- `<ellipse cx cy rx ry>`
-- `<rect x y width height rx>`
-
-Do not use transforms, filters, fills, or explicit stroke colors.
-
-Never use [`<use>`](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/use). It can reduce file size, but referenced IDs may conflict when SVGs are embedded in HTML.
-
-## Metadata file
-
-Each icon must also have a matching JSON file with contributors, use cases, tags, and categories.
-
-See [metadata conventions](./metadata-conventions/) for details.
-
-## Validation
-
-Before submitting SVG changes, format and validate the icon files:
-
-```sh
-pnpm run lint:icons
-```
-
-You can automatically format SVG files with Prettier:
-
-```sh
-pnpm run lint:icons-fix
-```
-
-To check icon names, categories, metadata, and SVG structure together, run:
-
-```sh
-pnpm run lint:icons:all
-```
-
-## Checklist
-
-Before opening a pull request, confirm that:
-
-- The SVG uses the standard `24 × 24` viewBox.
-- The SVG uses `fill="none"` and `stroke="currentColor"`.
-- Stroke width, line caps, and line joins match the Lucide defaults.
-- Paths are tidy and use appropriate numeric precision.
-- The SVG uses only allowed elements and attributes.
-- The SVG does not use transforms, filters, fills, explicit strokes, or `<use>`.
-- The icon has a matching JSON metadata file.
-- `pnpm run lint:icons` passes.
-- `pnpm run lint:json:icons` passes.

docs/contribute/icons/design-principles.md

@@ -1,368 +0,0 @@
----
-description: Learn the visual principles that make Lucide icons consistent and recognizable.
----
-
-# Lucide design language
-
-Lucide is a consistent icon set, not a collection of unrelated icons. Every icon should feel like it belongs with the rest of the library.
-
-This guide explains the visual rules behind Lucide icons and how to use them when designing new icons.
-
-For the full rule list, see the [icon design specification](./specification)
-
-## 1. Use a 24 × 24-pixel canvas
-
-Icons **must** be designed on a 24 × 24-pixel canvas.
-
-:::: example
-::: do ../../images/24px-24px.svg?raw=true
-Use a **24 × 24 pixel** canvas.
-:::
-::: dont ../../images/24px-24px-violation.svg?raw=true
-Don't use a canvas that is larger, smaller, or not square.
-:::
-::::
-
-## 2. Keep a 1-pixel safe zone
-
-Icons **must** have at least 1 pixel of padding between their strokes and the edge of the canvas.
-
-:::: example
-::: do ../../images/1px-padding.svg?raw=true
-Keep at least **1 pixel of padding** around the icon.
-:::
-::: dont ../../images/1px-padding-violation.svg?raw=true
-Don't place strokes at the edge of the canvas. They may get clipped.
-:::
-::::
-
-## 3. Use 2-pixel strokes
-
-Strokes **must** be 2 pixels wide.
-
-:::: example
-::: do ../../images/2px-stroke.svg?raw=true
-Use a **2-pixel stroke width**.
-:::
-::: dont ../../images/2px-stroke-violation.svg?raw=true
-Don't use **thicker or thinner** strokes, or **mix stroke widths**.
-:::
-::::
-
-## 4. Use round line joins
-
-Strokes **must** use round line joins.
-
-:::: example
-::: do ../../images/round-joints.svg?raw=true
-Use **round line joins**.
-:::
-::: dont ../../images/round-joints-violation.svg?raw=true
-Don't use **miter or bevel** line joins.
-:::
-::::
-
-::: tip
-Round joins do not replace corner rounding. Most sharp corners still need a radius.
-:::
-
-## 5. Use round line caps
-
-Open paths **must** use round line caps.
-
-:::: example
-::: do ../../images/round-caps.svg?raw=true
-Use **round line caps** on open paths.
-:::
-::: dont ../../images/round-caps-violation.svg?raw=true
-Don't use **butt or square** line caps.
-:::
-::::
-
-## 6. Use centered strokes
-
-Strokes **must** be centered on their paths.
-
-:::: example
-::: do ../../images/centered-strokes.svg?raw=true
-Keep strokes **centered** on their paths.
-:::
-::: dont ../../images/centered-strokes-violation.svg?raw=true
-Don't use **inside or outside** strokes. They change how line joins appear, creating sharp inner corners.
-:::
-::::
-
-## 7. Use consistent corner radii
-
-Almost every sharp corner **should** be rounded.
-
-:::: example
-::: do ../../images/border-radius-correct.svg?raw=true
-Use **rounded corners**.
-:::
-::: dont ../../images/border-radius-violation.svg?raw=true
-Don't use **sharp corners**.
-:::
-::::
-
-Corner radius depends on the size of the element and the angle. For 90° angles:
-
-:::: example
-::: do ../../images/2px-border-radius.svg?raw=true
-Use a **2-pixel corner radius** for shapes that are at least 8 pixels wide or tall.
-:::
-::: do ../../images/1px-border-radius.svg?raw=true
-Use a **1-pixel corner radius** for shapes smaller than 8 pixels.
-:::
-::::
-
-There are exceptions:
-
-:::: example
-::: do ../../images/border-radius-90deg.svg?raw=true
-Diagonal lines that meet at a right angle usually need a **2.41 pixel** radius (1+√2) to stay aligned to the grid.
-:::
-::: do ../../images/border-radius-arbitrary.svg?raw=true
-Even **very sharp corners** usually need a small amount of rounding. The exact amount depends on the shape.
-:::
-::::
-
-Avoid rounding corners **where multiple lines meet**.
-
-:::: example
-::: do ../../images/border-radius-line-join.svg?raw=true
-Keep corners sharp where multiple lines meet so the icon scales well.
-:::
-::: dont ../../images/border-radius-line-join-violation.svg?raw=true
-Don't round corners where more than two lines meet. This can make the icon scale poorly.
-:::
-::::
-
-## 8. Keep at least 2 pixels between elements
-
-Distinct elements **must** have at least 2 pixels of visual spacing between them.
-
-:::: example
-::: do ../../images/2px-element-spacing.svg?raw=true
-Keep **2 pixels of spacing** between distinct elements.
-:::
-::: dont ../../images/1px-element-spacing.svg?raw=true
-Don't use gaps smaller than **2 pixels** between distinct elements.
-:::
-::::
-
-This also applies inside shapes. Most inner gaps **should** be at least 2 pixels wide.
-
-:::: example
-::: do ../../images/2px-inner-spacing.svg?raw=true
-Keep at least **2 pixels of spacing** inside shapes.
-:::
-::: dont ../../images/1px-inner-spacing.svg?raw=true
-Don't use inner gaps smaller than **2 pixels**.
-:::
-::::
-
-You can test this by placing a **2-pixel-wide circle** inside your shape.
-
-:::: example
-::: do ../../images/2px-inner-gap.svg?raw=true
-If a 2-pixel-wide circle fits **without overlapping**, the gap is **wide enough**.
-:::
-::: dont ../../images/1px-inner-gap.svg?raw=true
-If the circle **overlaps** the shape, the gap should be **wider**.
-:::
-::::
-
-The 2 pixel spacing also applies when elements visually connect or intersect.
-
-:::: example
-::: dont ../../images/2px-element-spacing-connected.svg?raw=true
-Don't connect elements without keeping **2 pixels of spacing**.
-:::
-::: dont ../../images/2px-element-spacing-abrupt-cut.svg?raw=true
-Don't use **abrupt cuts** where one element meets another.
-:::
-::::
-
-## 9. Aim for consistent visual weight
-
-Icons should have a similar visual weight when viewed alongside each other.
-
-:::: example
-
-::: do ../../images/visual-weight-consistent.svg?raw=true
-Match the visual weight of `circle` and `square`.
-:::
-
-::: dont ../../images/visual-weight-uneven.svg?raw=true
-The first icon is **too large**. The last one is **too small**.
-:::
-
-::::
-
-::: tip
-The amount and placement of strokes affect how heavy an icon looks. An icon with many close strokes can look heavier than a simpler icon, even with the same stroke width.
-
-Place your icon next to `circle` or `square`, then blur both icons. Your icon should not look much lighter or darker than the reference icon.
-:::
-
-## 10. Balance icons visually
-
-Icons should look centered and balanced within the canvas.
-
-:::: example
-::: do ../../images/visually-centered-do.svg?raw=true
-Keep your icons visually centered.
-:::
-::: dont ../../images/visually-centered-dont.svg?raw=true
-This icon feels shifted toward the top left.
-:::
-::::
-
-:::: example
-::: do ../../images/visually-centered-symmetrical-do.svg?raw=true
-Symmetrical icons should remain geometrically centered.
-:::
-::: dont ../../images/visually-centered-symmetrical-dont.svg?raw=true
-Don't place symmetrical icons off-center for no good reason.
-:::
-::::
-
-::: tip
-Geometric centering does not always look centered. Asymmetrical shapes may need a small adjustment.
-
-Compare your icon with `circle` or `square` side by side and stacked vertically. If it looks shifted, adjust it.
-:::
-
-## 11. Keep density low
-
-Lucide icons should have a similar level of detail.
-
-:::: example
-::: do ../../images/density-optimal.svg?raw=true
-Simplify complex subjects, but keep the features that make them recognizable.
-:::
-::: dont ../../images/density-too-dense.svg?raw=true
-Don't add extra details that make the design feel crowded.
-:::
-::::
-
-::: tip
-
-Dense areas and close strokes can make an icon look heavier than nearby icons.
-
-View the icon at its intended size and blur it. Areas that turn dark may have too much detail.
-
-:::
-
-## 12. Use smooth, simple curves
-
-Curves should be smooth and as simple as the shape allows.
-
-:::: example
-::: do ../../images/curvature-smooth.svg?raw=true
-Prefer **simple arcs** and **quadratic curves** where possible.
-:::
-::: dont ../../images/curvature-uneven.svg?raw=true
-Don't use **uneven or unnecessarily complex** curves.
-:::
-::::
-
-::: tip
-When you need cubic Bézier curves, align their control points to avoid visible bumps.
-
-Avoid extra control points. They make shapes harder to edit and can create small flaws.
-:::
-
-## 13. Design for the pixel grid
-
-Lucide icons should look sharp at small sizes, including on low-density displays.
-
-:::: example
-::: do ../../images/pixel-perfection-ideal.svg?raw=true
-Align coordinates, arc centers, and other geometric elements to the pixel grid when possible.
-:::
-::: dont ../../images/pixel-perfection-bad.svg?raw=true
-Don't place geometry off the pixel grid without a visual reason.
-:::
-::::
-
-:::: example
-::: do ../../images/pixel-perfection-subelement-do.svg?raw=true
-Also **align subelements** to the pixel grid.
-:::
-::: dont ../../images/pixel-perfection-subelement-dont.svg?raw=true
-Don't place subelements off-grid. They may become blurry on low-density displays.
-:::
-::::
-
-:::: example
-::: do ../../images/pixel-perfection-diagonals-do.svg?raw=true
-In general try to **align every diagonal line** to the pixel grid.
-:::
-::: dont ../../images/pixel-perfection-diagonals-dont.svg?raw=true
-Avoid placing diagonal lines off-grid. They will appear blurry and optically wider on low-density displays.
-:::
-::::
-
-::: tip
-Pixel alignment should support the icon. Do not let it harm shape recognition, smooth curves, or visual balance.
-:::
-
-## 14. Reuse established shapes
-
-When creating a variant, keep the base icon geometry unless the new idea needs a change.
-
-:::: example
-::: do ../../images/established-shapes-base-do.svg?raw=true
-Reuse existing base icons **exactly as they appear**.
-:::
-::: dont ../../images/established-shapes-base-dont.svg?raw=true
-Don't change the **geometry, placement, or orientation** of base shapes.
-:::
-::::
-
-Related icons should share shapes and visual patterns when possible.
-
-:::: example
-::: do ../../images/established-shapes-sub-do.svg?raw=true
-Reuse elements from existing icons **without change**.
-:::
-::: dont ../../images/established-shapes-sub-dont.svg?raw=true
-Don't redesign **existing elements**.
-:::
-::::
-
-Common modifiers and elements should look consistent across the library.
-
-:::: example
-::: do ../../images/established-shapes-consistency-do.svg?raw=true
-Keep add-ons consistent in **placement and size**.
-:::
-::: dont ../../images/established-shapes-consistency-dont.svg?raw=true
-Don't use **irregular placement or size** compared to existing icons.
-:::
-::::
-
-::: tip
-Preserving the base shape makes related icons work better when users switch between them.
-
-Consistency with an existing icon should not override clarity, balance, or readability. Adjust the shape when needed.
-:::
-
-## Summary
-
-When designing a Lucide icon:
-
-1. **Use a 24 × 24 pixel canvas** with at least **1 pixel of safe zone**.
-2. **Use 2 pixel centered strokes** with **round caps and joins**.
-3. **Round sharp corners** using consistent radii appropriate for their size and geometry.
-4. **Keep at least 2 pixels of spacing** between distinct elements and, where possible, inside shapes.
-5. **Match the visual weight** of `circle` and `square`.
-6. **Center icons visually**, accounting for visual weight.
-7. **Keep visual density low** and remove unnecessary detail.
-8. **Use smooth, simple curves** without unnecessary control points.
-9. **Align geometry to the pixel grid** where possible.
-10. **Reuse established shapes** from existing Lucide icons.
-
-When these guidelines conflict, prioritize **clarity, visual balance, and consistency** with the rest of Lucide.

docs/contribute/icons/figma-guide.md

@@ -1,60 +0,0 @@
----
-description: Learn how to create Lucide icons in Figma.
----
-
-# Figma template guide
-
-This guide shows how to set up Figma for Lucide icons.
-
-## Set up the frame
-
-Create each icon in its own frame.
-
-Use a `24 × 24` pixel frame.
-
-1. Click the frame button, or press `F`.
-2. Draw a `24 × 24` frame, or set the size in the right sidebar.
-
-Design the icon inside this frame. Name the frame after the icon so Figma exports it as `frame-name.svg`.
-
-## Create your icon
-
-Set up the stroke before drawing.
-
-Draw in the frame with the pen tool. Open it from the toolbar or press `P`. After you start drawing, adjust the vector settings in the right sidebar.
-
-Set the following:
-
-1. Vector
-   1. Corner radius: 2px
-2. Stroke
-   1. Stroke width: 2px
-   2. Stroke alignment: center
-
-![Figma stroke options](../../images/figma-stroke-options.png)
-
-## Export or copy your icon
-
-When your icon is ready, export it.
-
-1. Select the frame.
-2. Open the _Export_ section in the right sidebar.
-3. Set the file type to SVG.
-4. Click _Export_.
-
-You can also copy the SVG source.
-
-1. Select the frame.
-2. Right-click it.
-3. Choose _Copy/Paste as_.
-4. Choose _Copy as SVG_.
-
-You now have an SVG to prepare for contribution.
-
-## Optimize your icon
-
-You can optimize the exported SVG with [Lucide Studio](https://studio.lucide.dev/).
-
-## Check spacing in Figma
-
-The [design language](design-principles.md) requires at least 2 pixels of spacing between separate elements. In Figma, hold `Option` on macOS or `Alt` on Windows to check spacing.

docs/contribute/icons/illustrator-guide.md

@@ -1,27 +0,0 @@
----
-description: Learn how to use the Adobe Illustrator template for Lucide.
----
-
-# Adobe Illustrator template guide
-
-This guide explains how to use the Adobe Illustrator template for Lucide.
-
-> Templates can fall out of date. Check the [design language](design-principles.md) before you start.
-
-## Workflow
-
-The Illustrator template follows the [design language](design-principles.md).
-
-1. Download and open the [Illustrator template](https://github.com/lucide-icons/lucide/blob/main/docs/public/templates/illustrator_template.ai).
-
-2. Remove the content from the example logo layer (`Draw`) and start drawing.
-
-3. Check that your icon follows the [design language](design-principles.md).
-
-4. Before export, remove unnecessary layers, especially `Padding` and `Grid`.
-
-5. Export the file with `Export > Export As...`, then save it as SVG. Use these SVG options:
-
-   ![SVG export options in Illustrator](../../images/illustrator-svg-options.png?raw=true 'SVG export options in Illustrator')
-
-6. Optimize your SVG with [Lucide Studio](https://studio.lucide.dev/)

docs/contribute/icons/index.md

@@ -1,35 +0,0 @@
----
-description: Guidelines and instructions for contributing icons to Lucide
----
-
-<script setup>
-import OverviewLink from '../../.vitepress/theme/components/base/OverviewLink.vue';
-import OverviewLinkGrid from '../../.vitepress/theme/components/base/OverviewLinkGrid.vue';
-import { resourcesSidebar } from '../../.vitepress/sidebar/resources.ts';
-</script>
-
-# Designing icons for Lucide
-
-Every icon should feel like it belongs with the rest of Lucide.
-
-This guide explains how to design and prepare icons for Lucide.
-
-## What this guide covers
-
-<OverviewLinkGrid>
-  <OverviewLink v-for="item in resourcesSidebar[2].items.slice(1, -1)" :key="item.link" :href="item.link" :title="item.text" :desc="item.desc"/>
-</OverviewLinkGrid>
-
-## Use your preferred design tool
-
-You can design Lucide icons with any vector editor that can export SVG.
-
-Use these step-by-step guides for common tools:
-
-<OverviewLinkGrid>
-  <OverviewLink v-for="item in resourcesSidebar[2].items.at(-1).items" :key="item.link" :href="item.link" :title="item.text" :desc="item.desc"/>
-</OverviewLinkGrid>
-
-These guides explain how to set up your document, follow the Lucide rules, and export a usable SVG.
-
-Regardless of which tool you use, the same design and SVG requirements apply.

docs/contribute/icons/inkscape-guide.md

@@ -1,42 +0,0 @@
----
-description: Learn how to create Lucide icons in Inkscape.
----
-
-# Inkscape setup guide
-
-This guide shows how to set up Inkscape for Lucide icons.
-
-## Set up the canvas
-
-Inkscape creates new documents with a default canvas size. Change it to `24 × 24` pixels:
-
-1. Open the Document Properties dialog with `File > Document Properties`.
-2. On the _Page Size_ tab, under _Custom Size_, set units to `px` and set width and height to `24`.
-   ![Setting page size](../../images/page-size.png?raw=true 'Setting page size')
-3. On the _Grid_ tab, select `Rectangular Grid` and click _New Grid_.
-   ![Setting grid properties](../../images/grid-1.png?raw=true 'Setting grid properties')
-4. Set grid units to `px`, then set `Spacing X` and `Spacing Y` to `1`.
-   ![Setting grid properties](../../images/grid-2.png?raw=true 'Setting grid properties')
-5. Close the Document Properties dialog.
-6. To center the canvas in the viewport, select `View > Zoom > Drawing`.
-
-## Set up paths
-
-1. Create a path or shape.
-2. With the path selected, press `Ctrl+Shift+F` to open the Stroke and Fill panel.
-   ![Stroke style properties](../../images/strokes.png?raw=true 'Setting grid properties')
-3. On the _Stroke Style_ tab:
-   - Set stroke width to `2px`.
-   - Select the rounded join type.
-   - Select the rounded cap type.
-4. For rectangles, select the rectangle and set `Rx` and `Ry` to `2px` in the toolbar.
-   ![Rectangle radius properties](../../images/corner-radius.png?raw=true 'Rectangle radius properties')
-
-## Save a file
-
-1. When you are ready, click _Save As_ and choose _Optimized SVG_ as the file type.
-   ![Save as](../../images/save-as.png?raw=true 'Save as')
-
-## Optimize your icon
-
-As a final step, optimize your SVG with [Lucide Studio](https://studio.lucide.dev/).

docs/contribute/icons/metadata-conventions/index.md

@@ -1,169 +0,0 @@
----
-description: Learn how to write clear and consistent metadata for Lucide icons.
----
-
-<script setup>
-import OverviewLink from '../../../.vitepress/theme/components/base/OverviewLink.vue';
-import OverviewLinkGrid from '../../../.vitepress/theme/components/base/OverviewLinkGrid.vue';
-</script>
-
-# Metadata conventions
-
-Every Lucide icon has a matching JSON metadata file. Metadata credits contributors, groups icons, improves search, and explains where an icon is useful.
-
-Use this guide when you add a new icon or review existing metadata.
-
-## Metadata file location
-
-Each icon metadata file must live next to its SVG file in the `icons` directory.
-
-The JSON file must use the same base name as the SVG file:
-
-- `home.svg` -> `home.json`
-- `arrow-up.svg` -> `arrow-up.json`
-- `square-parking.svg` -> `square-parking.json`
-
-All icon metadata files must pass `icon.schema.json`.
-
-## Required fields
-
-Every icon metadata file must include:
-
-- `$schema`
-- `contributors`
-- `use-cases`
-- `tags`
-- `categories`
-
-A minimal metadata file looks like this:
-
-```json
-{
-  "$schema": "../icon.schema.json",
-  "contributors": ["github-username", "another-github-username"],
-  "use-cases": ["Representing example items in an interface"],
-  "tags": ["foo", "bar"],
-  "categories": ["devices"]
-}
-```
-
-## Contributors
-
-The `contributors` field lists GitHub usernames for people who created or meaningfully changed the icon.
-
-### Contributor rules
-
-1. If you create a new icon based on existing ones, add all contributors from all base icons.
-2. Add a username when someone made a significant change to the icon design.
-3. Do not add people for minor review comments, metadata-only edits, or unrelated discussion.
-
-## Use cases
-
-The `use-cases` field explains where and why someone would use the icon in an interface.
-
-Use cases should be short phrases, not full sentences. Start with an `-ing` verb, such as:
-
-- Representing [concept]
-- Indicating [state]
-- Marking [item]
-- Showing [information]
-- Toggling [setting]
-
-### Use case rules
-
-- Keep each use case focused on one idea
-- Keep entries concise and specific
-- Write from the interface's perspective
-- Describe real usage, not the icon name or appearance
-- Add context when it clarifies meaning
-- Do not end with punctuation
-- Do not add Markdown or emoji
-- Do not add implementation details or pull request references
-
-<OverviewLinkGrid>
-  <OverviewLink href="./use-case-guide.md" title="Use case guide" desc="Learn the best practices for writing use cases"/>
-</OverviewLinkGrid>
-
-## Tags
-
-The `tags` field is a list of search terms for the icon.
-
-Tags should describe concepts, synonyms, related terms, and common contexts.
-
-Check existing tags before adding new ones. This keeps search consistent and avoids duplicates.
-
-### Tag rules
-
-- Use lowercase tags.
-- Prefer single words where possible.
-- Multi-word tags are allowed when they are clearer, such as `magnifying glass`.
-- Do not include the icon name as a tag.
-- Do not add generic tags like `icon`.
-- Do not add unrelated concepts just to increase search coverage.
-
-For example, `mail-search` can use tags like `email`, `message`, `letter`, `find`, and `filter`, but not `mail`, `search` or `mail search`.
-
-<OverviewLinkGrid>
-  <OverviewLink href="./tag-guide.md" title="Tag guide" desc="Learn the best practices for writing tags"/>
-</OverviewLinkGrid>
-
-## Categories
-
-The `categories` field groups icons by broad use.
-
-Categories must come from the allowed category list in `icon.schema.json`.
-
-Choose categories based on what the icon represents and where people use it. Check similar icons first.
-
-### Category rules
-
-- Use only categories allowed by `icon.schema.json`.
-- Use lowercase category names.
-- Do not invent new categories in icon metadata.
-- Choose relevant categories only.
-
-## Variants and related icons
-
-Related icons should have related metadata, but do not copy use cases blindly.
-
-Write metadata for the specific variant:
-
-- `battery-low` -> `Indicating a low battery charge level`
-- `battery-full` -> `Indicating a full battery charge level`
-- `square-arrow-right-enter` -> sign in, enter, or join contexts
-- `square-arrow-right-exit` -> sign out, exit, or export contexts
-
-When a request covers several icons, assign each use case only to the icon it describes. Do not copy metadata to icons it does not describe.
-
-## Aliases
-
-Some icons can include an optional `aliases` field for alternate names.
-
-Only add aliases when an icon has been renamed from a non-compliant name.
-
-## Validation
-
-Before submitting metadata changes, validate the icon JSON files:
-
-```sh
-pnpm run lint:json:icons
-```
-
-You can also format changed files with Prettier:
-
-```sh
-pnpm exec prettier "icons/*.json" --check
-```
-
-## Checklist
-
-Before opening a pull request, confirm that:
-
-- The JSON file name matches the SVG file name.
-- The file includes all required fields.
-- Contributors are GitHub usernames.
-- Use cases describe real interface usage.
-- Tags are lowercase and useful for search.
-- Categories are allowed by `icon.schema.json`.
-- Metadata is specific to the icon and its variants.
-- `pnpm run lint:json:icons` passes.

docs/contribute/icons/metadata-conventions/tag-guide.md

@@ -1,131 +0,0 @@
----
-description: Learn the best practices for writing tags for Lucide icons.
----
-
-<script setup>
-import { batteryLow, calendar, droplet, hospital, mail, mailSearch, search, type } from '~/.vitepress/data/iconNodes';
-import LucideIcon from '~/.vitepress/theme/components/base/LucideIcon.vue';
-</script>
-
-# Tag guide
-
-This guide shows how to write useful search tags for Lucide icons.
-
-Tags help people find icons by concept, synonym, context, or common wording.
-
-## Use lowercase tags
-
-Tags should always be lowercase.
-
-:::: example
-::: do <LucideIcon :iconNode="mail" /> email
-Lowercase tags **match the style** used across the icon library.
-:::
-::: dont <LucideIcon :iconNode="mail" /> Email
-Capitalized tags create **inconsistent metadata** without improving search.
-:::
-::::
-
-## Prefer short tags
-
-Use one clear word when it is enough. Use multi-word tags when the phrase is clearer.
-
-:::: example
-::: do <LucideIcon :iconNode="search" /> search
-This is **short, common, and easy to find**.
-:::
-::: dont <LucideIcon :iconNode="search" /> searching through files & folders
-This reads like a **use case**, not a tag.
-:::
-::::
-
-## Use multi-word tags when needed
-
-Some ideas are only clear as a phrase. But keep those phrases short.
-
-:::: example
-::: do <LucideIcon :iconNode="droplet" /> blood type
-The phrase is **clearer** than either word on its own.
-:::
-::: dont <LucideIcon :iconNode="droplet" /> blood type medical label
-This combines **several search concepts** into one long tag.
-:::
-::::
-
-## Add synonyms and common wording
-
-Tags can include words people are likely to search for, even if they are not in the icon name.
-
-:::: example
-::: do <LucideIcon :iconNode="mail" /> email
-This helps users find `mail` icons using a **common synonym**.
-:::
-::: dont <LucideIcon :iconNode="mail" /> electronic postal message delivery
-This is unlikely search wording and **adds noise**.
-:::
-::::
-
-## Do not repeat the icon name
-
-The icon name is already searchable. Tags should add other ways to find it.
-
-:::: example
-::: do <LucideIcon :iconNode="mailSearch" /> message filter
-This adds a **related concept** for `mail-search` without duplicating the name.
-:::
-::: dont <LucideIcon :iconNode="mailSearch" /> mail search
-This **repeats the icon name** and does not improve discovery.
-:::
-::::
-
-## Avoid generic tags
-
-Tags should describe the icon, not say that it is an icon.
-
-:::: example
-::: do <LucideIcon :iconNode="calendar" /> event
-This points to a **specific idea** users might search for.
-:::
-::: dont <LucideIcon :iconNode="calendar" /> icon
-**Every entry is an icon**, so this tag does not help anyone find the right one.
-:::
-::::
-
-## Keep tags relevant
-
-Do not add loose terms just to make an icon appear in more searches.
-
-:::: example
-::: do <LucideIcon :iconNode="hospital" /> emergency room
-This is **relevant** for an icon that marks emergency room locations.
-:::
-::: dont <LucideIcon :iconNode="hospital" /> doctor nurse pharmacy
-These terms may be **nearby concepts**, but they do not all describe the same icon.
-:::
-::::
-
-## Match the specific variant
-
-Related icons can share family terms, but variant tags should describe what is different.
-
-:::: example
-::: do <LucideIcon :iconNode="batteryLow" /> depleted
-This distinguishes `battery-low` from **other battery icons**.
-:::
-::: dont <LucideIcon :iconNode="batteryLow" /> charged
-This describes `battery-full` better than `battery-low`.
-:::
-::::
-
-## Use existing tags as a reference
-
-Check similar icons before adding new tags. Reusing existing terms keeps search predictable.
-
-:::: example
-::: do <LucideIcon :iconNode="type" /> typography
-This matches existing text-formatting icons and keeps **related icons** together in search.
-:::
-::: dont <LucideIcon :iconNode="type" /> fontography
-Inventing a new term makes the icon harder to find and less consistent with related metadata.
-:::
-::::

docs/contribute/icons/metadata-conventions/use-case-guide.md

@@ -1,142 +0,0 @@
----
-description: Learn the best practices for writing use cases for Lucide icons.
----
-
-<script setup>
-import { batteryLow, creditCard, crop, handshake, heading2, microchip, search, squareParking, triangleAlert, wifiOff } from '~/.vitepress/data/iconNodes';
-import LucideIcon from '~/.vitepress/theme/components/base/LucideIcon.vue';
-</script>
-
-# Use case guide
-
-This guide shows how to write clear use cases for Lucide icons.
-
-## Write from the interface's perspective
-
-Describe what the interface tells the user. Do not write from the contributor's point of view.
-
-:::: example
-::: do <LucideIcon :iconNode="wifiOff" /> Indicating a device is offline or unreachable
-This describes the **role the icon plays in an interface**.
-:::
-::: dont <LucideIcon :iconNode="wifiOff" /> I need an icon for my offline device screen
-This explains the **contributor's situation**, not the icon's purpose.
-:::
-::::
-
-## Describe real usage, not the icon name
-
-A use case should explain what the icon means in context. Do not repeat the icon name or only describe the drawing.
-
-:::: example
-::: do <LucideIcon :iconNode="microchip" /> Representing processors, chips, or embedded hardware
-This explains `microchip` **without repeating the name**.
-:::
-::: dont <LucideIcon :iconNode="microchip" /> it's a microchip icon
-This **duplicates the icon name** and does not explain where the icon would be used.
-:::
-::::
-
-## Add context when it clarifies meaning
-
-Some icons have broad meanings. Add context when it makes the use case clearer.
-
-:::: example
-::: do <LucideIcon :iconNode="heading2" /> Applying a level-2 heading in text editors
-The phrase explains both the **action and the product area**.
-:::
-::: dont <LucideIcon :iconNode="heading2" /> Applying a heading
-This is less useful because it **omits the level and context**.
-:::
-::::
-
-## Keep each use case focused
-
-Each entry should cover one clear idea. Split different meanings into separate entries.
-
-:::: example
-::: do <LucideIcon :iconNode="squareParking" /> Marking parking locations on maps
-This is **short, clear, and focused** on one interface function.
-:::
-::: dont <LucideIcon :iconNode="squareParking" /> Marking parking, transport, maps, cars, garages, and places
-This reads like a **tag list** and **mixes several ideas**.
-:::
-::::
-
-## Write variant-specific use cases
-
-For related icons, describe what makes each variant different.
-
-:::: example
-::: do <LucideIcon :iconNode="batteryLow" /> Indicating a low battery charge level
-This is specific to `battery-low` and **sets it apart** from other battery icons.
-:::
-::: dont <LucideIcon :iconNode="batteryLow" /> Representing battery status
-This is **too generic** and could apply to **every battery variant**.
-:::
-::::
-
-## Avoid pull request references
-
-Use cases should make sense after the pull request is merged.
-
-:::: example
-::: do <LucideIcon :iconNode="handshake" /> Signifying a deal, agreement, or partnership
-This keeps the **useful meaning** without depending on **outside context**.
-:::
-::: dont <LucideIcon :iconNode="handshake" /> Same as above in #1234
-This **depends on a discussion** readers **may never see**.
-:::
-::::
-
-## Keep entries concise
-
-Use cases should usually be 4 to 12 words. Prefer a short phrase over a long explanation.
-
-:::: example
-::: do <LucideIcon :iconNode="search" /> Searching files by name or content
-This is **short enough** to scan and **specific enough** to understand.
-:::
-::: dont <LucideIcon :iconNode="search" /> This icon can be used when users want to search through all of their files and folders to find something
-This is **too long** and reads like **product copy instead of metadata**.
-:::
-::::
-
-## Do not end with punctuation
-
-Use cases are metadata phrases, not full sentences.
-
-:::: example
-::: do <LucideIcon :iconNode="creditCard" /> Confirming a successful payment
-This matches the **phrase style** used across icon metadata.
-:::
-::: dont <LucideIcon :iconNode="creditCard" /> Confirming a successful payment.
-The period adds **unnecessary punctuation** and makes entries inconsistent.
-:::
-::::
-
-## Avoid markdown and emoji
-
-Use plain text only. Formatting belongs in documentation, not metadata values.
-
-:::: example
-::: do <LucideIcon :iconNode="triangleAlert" /> Warning users about a destructive action
-This works in search, generated pages, and other places that use metadata.
-:::
-::: dont <LucideIcon :iconNode="triangleAlert" /> <span>**Warning** users about a destructive action ⚠️</span>
-Markdown and emoji can **show up in generated UI** and make metadata **harder to reuse**.
-:::
-::::
-
-## Avoid implementation details
-
-Use cases should describe meaning, not how the SVG was made.
-
-:::: example
-::: do <LucideIcon :iconNode="crop" /> Representing cropped or trimmed content
-This explains the icon's **interface meaning**.
-:::
-::: dont <LucideIcon :iconNode="crop" /> Showing a rectangle with two path cuts and adjusted Bezier handles
-This describes **construction details** that do not help people find or understand the icon.
-:::
-::::

docs/contribute/icons/naming-conventions.md

@@ -1,238 +0,0 @@
----
-description: Learn how to choose clear and consistent names for Lucide icons.
----
-
-<script setup>
-import {
-  arrowDown01,
-  badgeCheck,
-  badgePlus,
-  ban,
-  boneFracture,
-  circleDashed,
-  circleFadingArrowUp,
-  circleUser,
-  clock3,
-  heartCrack,
-  moonStar,
-  notepadTextDashed,
-  pencilRuler,
-  rulerDimensionLine,
-  save,
-  sendHorizontal,
-  squareDashed,
-  sunSnow,
-  userRound,
-} from '~/.vitepress/data/iconNodes';
-import LucideIcon from '~/.vitepress/theme/components/base/LucideIcon.vue';
-const pencilRulerHorizontal = [
-  ["path",{"d":"M10 16v-3","key":"1sz6hv"}],
-  ["path",{"d":"M14 16v-3","key":"1rh0ni"}],
-  ["path",{"d":"M16 2.999v5.98","key":"q5wnuh"}],
-  ["path",{"d":"M18 16v-3","key":"gc63g1"}],
-  ["path",{"d":"M19.005 2.994A3 3 0 0122 5.984a3 3 0 01-2.986 2.99l-11.777.017a2 2 0 01-.943-.25l-4.03-2.274a.5.5 0 010-.934l4.03-2.274a2 2 0 01.944-.247z","key":"1bk0ej"}],
-  ["path",{"d":"M6 16v-3","key":"h6yyjy"}],
-  ["rect",{"x":"2","y":"13","width":"20","height":"8","rx":"2","key":"ct2kk9"}]
-];
-const pencilRulerVertical = [
-  ["path",{"d":"M16 10h-3","key":"4p2xpj"}],
-  ["path",{"d":"M16 14h-3","key":"1xsqil"}],
-  ["path",{"d":"M16 18h-3","key":"12gup7"}],
-  ["path",{"d":"M16 6h-3","key":"1o5sfa"}],
-  ["path",{"d":"M2.995 19.005a1 1 0 105.98.01L8.99 7.236a2 2 0 00-.25-.943l-2.274-4.03a.5.5 0 00-.934 0L3.26 6.294a2 2 0 00-.248.944z","key":"rw57er"}],
-  ["path",{"d":"M3 16h5.979","key":"kkz6vb"}],
-  ["rect",{"x":"13","y":"2","width":"8","height":"20","rx":"2","key":"qzgro9"}]
-];
-</script>
-
-# Naming conventions
-
-Learn how to choose clear, consistent names for Lucide icons.
-
-This page covers word order, modifiers, variants, related icons, and other rules that keep icon names predictable.
-
-Use this when naming a new icon or reviewing a proposed name.
-
-## 1. Use lowercase kebab-case
-
-Icon names **must** use lowercase kebab-case.
-
-:::: example
-::: do `arrow-up-0-1`
-Use lowercase kebab-case.
-:::
-::: dont `Arrow Up 0-1` or `arrowUp01`
-Avoid other naming schemes.
-:::
-::::
-
-## 2. Use American English
-
-Icon names **must** use American English, not local variants.
-
-:::: example
-::: do <span>`color`, `maximize`, `center`</span>
-:::
-::: dont <span>`colour`, `maximise`, `centre`</span>
-:::
-::::
-
-## 3. Name icons for what they depict
-
-Icon names **must** describe what the icon shows, not how someone might use it.
-
-:::: example
-::: do <LucideIcon :iconNode="save" /> `floppy-disk`
-The icon **shows** a floppy disk.
-:::
-::: dont <LucideIcon :iconNode="save" /> `save`
-Save is a use case.
-:::
-::::
-
-:::: example
-::: do <LucideIcon :iconNode="ban" /> `circle-slash`
-The icon **shows** a circle with a slash across it.
-:::
-::: dont <LucideIcon :iconNode="ban" /> `ban`
-Ban is an action.
-:::
-::::
-
-::: tip
-An icon can mean different things in different products. Naming icons by appearance keeps names clear and independent from use cases.
-:::
-
-## 4. Name related icons consistently
-
-Icons that belong to the same group **must** use the `<group>-<variant>` naming scheme.
-
-The group name comes first. The variant comes after it.
-
-:::: example
-::: do <span><LucideIcon :iconNode="badgePlus" /> + <LucideIcon :iconNode="badgeCheck" /></span> <span>`badge-plus` & `badge-check`</span>
-`badge` is the group.
-:::
-::: dont <span><LucideIcon :iconNode="badgePlus" /> + <LucideIcon :iconNode="badgeCheck" /></span> <span>`plus-badge` & `check-badge`</span>
-`plus` and `check` are not the group.
-:::
-::::
-
-## 5. Describe alternate icons
-
-Alternate versions of an icon **must** be named for what makes them visually different. Do **not** use numbers just to separate one version from another.
-
-:::: example
-::: do <LucideIcon :iconNode="sendHorizontal" /> `send-horizontal`
-The icon depicts a horizontal "send" symbol.
-:::
-::: dont <LucideIcon :iconNode="sendHorizontal" /> <span>`send-2` or `send-alt`</span>
-"send number 2" and "alternative send" are not clear names.
-:::
-::::
-
-## 6. Only use numerals when depicted
-
-Icon names **must not** include numbers unless the icon shows the number.
-
-:::: example
-::: do <LucideIcon :iconNode="arrowDown01" /> `arrow-down-0-1`
-The arrow points from 0 to 1.
-:::
-::: dont <LucideIcon :iconNode="sendHorizontal" /> `send-2`
-The icon does not show the number 2.
-:::
-::::
-
-:::: example
-::: do <LucideIcon :iconNode="clock3" /> `clock-3`
-The hands point to 3 o'clock.
-:::
-::: dont <LucideIcon :iconNode="userRound" /> `user-3`
-The icon does not show the number 3.
-:::
-::::
-
-Do not use numbers to separate similar icons.
-
-## 7. Order elements by size
-
-When an icon shows multiple elements of different sizes, order their names from largest to smallest.
-
-For an icon containing a circle and a person:
-
-:::: example
-::: do <LucideIcon :iconNode="moonStar" /> `moon-star`
-The `moon` is larger than the `star`.
-:::
-::: dont <LucideIcon :iconNode="circleUser" /> `person-circle`
-The `person` is **not** larger than the `circle`.
-:::
-::::
-
-## 8. Order equally sized elements by position
-
-When an icon depicts multiple elements of roughly equal size, their names **must** be ordered according to their visual position.
-
-If elements overlap, name them from front to back.
-
-If they do not overlap, name them in English reading order: top to bottom, then left to right.
-
-:::: example
-::: do <LucideIcon :iconNode="pencilRuler" /> `pencil-ruler`
-The `pencil` is **in front** of the `ruler`, so it comes first.
-:::
-::: do <LucideIcon :iconNode="rulerDimensionLine" /> `ruler-dimension-line`
-The ruler is below the dimension line, but it is **larger**, so it comes first.
-:::
-::::
-
-:::: example
-::: do <LucideIcon :iconNode="sunSnow" /> `sun-snow`
-The `sun` is **left of** the `snowflake`, so it comes first.
-:::
-::: dont <LucideIcon :iconNode="pencilRulerHorizontal" /> `ruler-pencil`
-The `ruler` is **below** the `pencil`, so `pencil-ruler` is the correct name.
-:::
-::::
-
-## 9. Place modifiers after the element they describe
-
-Modifiers **must** come after the element they describe: `<element>-<modifier>`.
-
-:::: example
-::: do <LucideIcon :iconNode="heartCrack" /> `heart-broken`
-The icon shows a heart that is **cracked**.
-:::
-::: dont <LucideIcon :iconNode="boneFracture" /> `broken-bone`
-The icon shows a bone that is **broken**, so name it `bone-broken`.
-:::
-::::
-
-When an icon has multiple modified elements, each modifier **must** follow the element it describes.
-
-:::: example
-::: do <LucideIcon :iconNode="circleFadingArrowUp" /> `circle-fading-arrow-up`
-The icon shows a **fading** circle with an arrow pointing **up** inside it.
-
-`circle` comes first because it is larger than `arrow`. `fading` follows `circle` because it modifies the circle. `up` follows `arrow` because it modifies the arrow.
-:::
-::: dont <LucideIcon :iconNode="notepadTextDashed" /> `notepad-text-dashed`
-This icon shows a dashed notepad with text inside, so name it `notepad-dashed-text`.
-
-`notepad` comes first because it is larger than `text`. `dashed` follows `notepad` because it modifies the notepad. `text` follows both because `dashed` does not modify `text`.
-:::
-::::
-
-## Summary
-
-When naming an icon:
-
-1. **Describe what you see**, not what the icon could mean.
-2. **Use American English** and **lowercase kebab-case**.
-3. **Keep related icons together** with `<group>-<variant>`.
-4. **Describe what makes an alternate unique** instead of numbering it.
-5. **Only use numerals when they are depicted** in the icon.
-6. **Order elements from largest to smallest**.
-7. If elements are roughly the same size, order them **front to back**, or otherwise in **English reading order**.
-8. **Place modifiers after the element they describe**: `<element>-<modifier>`.

docs/contribute/icons/specification.md

@@ -1,95 +0,0 @@
----
-description: Rules Lucide icons must follow.
----
-
-# Icon design specification
-
-This page lists the rules Lucide icons must follow.
-
-For examples and guidance, see the [Lucide design language](./design-principles).
-
-## Requirement levels
-
-These terms show how strictly each rule applies:
-
-- **Must** and **must not** mark required rules.
-- **Should** and **should not** mark rules that can flex when needed to make a better icon.
-
-Any exception should be intentional and fit the [Lucide design language](./design-principles).
-
-## Canvas
-
-1. Icons **must** use a 24 × 24-pixel canvas.
-2. The canvas **must** be square.
-3. Icon strokes **must** remain at least 1 pixel from the edge of the canvas.
-
-## Strokes
-
-1. Strokes **must** be 2 pixels wide.
-2. Strokes **must** use round line joins.
-3. Open paths **must** use round line caps.
-4. Strokes **must** be centered on their paths.
-
-## Corners
-
-1. Sharp corners **should** be rounded unless the geometry of the icon requires otherwise.
-2. Elements at least 8 pixels wide or tall **should** use a 2-pixel corner radius for 90° corners.
-3. Elements smaller than 8 pixels **should** use a 1-pixel corner radius for 90° corners.
-4. Diagonal lines meeting at a 90° angle **should** use a radius that preserves pixel-grid alignment. This radius is typically approximately 2.41 pixels.
-5. Acute corners **should** use an appropriate amount of rounding based on their geometry.
-6. Corners where multiple lines meet **should** remain sharp when rounding would cause the icon to render inconsistently at different sizes.
-
-## Spacing
-
-1. Distinct elements **must** have at least 2 pixels of visual separation.
-2. Gaps between distinct elements **must not** be smaller than 2 pixels.
-3. Inner gaps **should** be at least 2 pixels wide.
-4. Spacing **should** remain visually consistent where elements connect or intersect.
-5. Elements **should not** terminate with an abrupt cut where another element visually continues or intersects them.
-
-## Visual weight
-
-1. Icons **should** have a visual weight similar to the `circle` and `square` icons.
-2. Icons **should not** appear substantially larger, smaller, heavier, or lighter than comparable Lucide icons.
-
-## Alignment and balance
-
-1. Icons **should** be visually centered within the canvas.
-2. Asymmetrical icons **may** be moved slightly off center so they look visually centered.
-3. Symmetrical icons **should** be geometrically centered.
-
-## Visual density
-
-1. Icons **should** have a level of detail similar to other Lucide icons.
-2. Details **should** be simplified when they cause an icon to appear substantially denser than comparable icons.
-3. Details that are not necessary for recognition **should** be omitted.
-
-## Curves
-
-1. Continuous curves **should** have smooth curvature.
-2. Curves **should not** contain unintended or abrupt changes in curvature.
-3. Arcs and quadratic Bézier curves **should** be preferred where they can accurately represent the intended geometry.
-4. Cubic Bézier curves **may** be used where necessary.
-5. Control points of adjoining cubic Bézier curves **should** be aligned where required to maintain continuous curvature.
-6. Curves **should not** contain unnecessary control points.
-
-## Pixel alignment
-
-1. Coordinates **should** align to the pixel grid where possible.
-2. Centers of arcs and other geometric elements **should** align to the pixel grid where possible.
-3. Off-grid geometry **may** be used when required for visual balance, recognizable geometry, or smooth curvature.
-4. Pixel alignment **should not** take precedence over the visual quality of the icon.
-
-## Shared geometry
-
-1. Variants of an existing icon **should** preserve the geometry, placement, and orientation of the base icon.
-2. Elements that already exist in other Lucide icons **should** reuse established geometry where applicable.
-3. Related icons **should** use consistent representations of shared elements.
-4. Common modifiers and add-ons **should** use consistent geometry, size, and placement across related icons.
-5. Existing geometry **may** be modified when necessary to satisfy other Lucide design language rules.
-
-## Priority of requirements
-
-When two non-required rules conflict, choose visual clarity and consistency with the Lucide design language.
-
-Rules marked **must** or **must not** can only be broken when the project defines an explicit exception.

docs/contribute/illustrator-guide.md

@@ -0,0 +1,31 @@
+---
+title: Illustrator Template Guide
+---
+
+# Illustrator Template Guide
+
+This Guide explains how to properly use the Adobe Illustrator Template for Lucide.
+
+>Attention: Even though it is unlikely the template can be outdated or not 100% correct. Please check the Icon Design Guide before you start working with the template to ensure integrity with the Lucide icon pack.
+
+## General Workflow
+
+The Illustrator template is created following guidelines from the [Icon Design Guide](icon-design-guide.md).
+
+**Workflow:**
+
+1. Download and open the [Illustrator template](https://github.com/lucide-icons/lucide/blob/main/docs/public/templates/illustrator_template.ai).
+
+2. You can now remove the content from the example logo layer ("Draw") and start creating.
+
+3. Verify that you follow the [Icon Design Guidelines](icon-design-guide.md).
+
+4. Before you export the file as an SVG make sure to check that you followed the guidelines and remove all unnecessary layers (especially "Padding" and "Grid").
+
+5. Export the file with the export menu under: `Export > Export As..` then save the file as SVG. Select the following options in the SVG Options dialog:
+
+![SVG export options in Illustrator](../images/illustrator-svg-options.png?raw=true "Setting Page Size")
+
+After that, double check that the [code conventions and SVG global attributes](icon-design-guide.md#code-conventions) are correct.
+
+7. Minify paths with [SVGOMG](https://jakearchibald.github.io/svgomg/).

docs/contribute/inkscape-guide.md

@@ -0,0 +1,41 @@
+---
+title: Icon Design Guide
+---
+
+# Inkscape Setup Guide
+
+This guide shows the steps to setup Inkscape for creating icons that conform to the Lucide design
+guidelines.
+
+## Setting up The Canvas
+
+When opening a new document, Inkscape will create a canvas of a default size.  To change the size to 24x24:
+
+1. Open the Document Properties dialog (File -> Document Properties).
+2. On the “Page Size” tab, under “Custom Size” set the Units to `px` and set both Height and Width to 24.
+![Setting Page Size](../images/page-size.png?raw=true "Setting Page Size")
+3. On the “Grid” tab, select `Rectangular Grid` and click “New Grid”.
+![Setting Grid Properties](../images/grid-1.png?raw=true "Setting Grid Properties")
+4. Set the Grid Units to `px` and set Spacing X and Spacing Y both to 1.
+![Setting Grid Properties](../images/grid-2.png?raw=true "Setting Grid Properties")
+5. Close the Document Properties dialog.
+6. To center the canvas in the viewport, select View -> Zoom -> Drawing.
+
+## Setting up The Paths
+
+1. Create a path or shape.
+2. With the path selected, open the Stroke and Fill panel by pressing `Ctrl+Shift+F` on your keyboard.
+![Stroke Style Properties](../images/strokes.png?raw=true "Setting Grid Properties")
+3. On the “Stroke Style” tab:
+   * Set Stroke Width to `2px`.
+   * Select the rounded join type.
+   * Select the rounded cap type.
+4. If the shape is a rectangle, select the rectangle and in the top of the screen below the menu bar, set `Rx` and `Ry` to `2px`.
+![Rectangle Radius Properties](../images/corner-radius.png?raw=true "Rectangle Radius Properties")
+
+## Saving A File
+
+1. When ready to save the file, click Save As and select “Optimized SVG” as the file type.
+![Save As](../images/save-as.png?raw=true "Save as")
+2. After clicking Save, to conform with the other icons in the package, set Pretty Printing to use spaces and set the indentation depth to 2.
+![Optimize](../images/optimize-settings.png?raw=true "Optimize")

docs/guide/angular/advanced/with-lucide-lab.md

@@ -13,7 +13,7 @@ import Sandpack from '~/.vitepress/theme/components/editors/SandpackAngular.vue'
 While they aren't provided as standalone components, they can be still be passed to the `LucideIcon` component the same way as official icons:
 
 ::: info Limitation
-Only custom icons that follow Lucide's [code conventions](../../../contribute/icons/code-conventions.md#code-conventions) are supported.
+Only custom icons that follow Lucide's [code conventions](../../../contribute/icon-design-guide.md#code-conventions) are supported.
 :::
 
 ### Directly as LucideIconData

docs/images/1px-element-spacing.svg

@@ -1,69 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1939_21540)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M200 80H100C88.9543 80 80 88.9543 80 100V200C80 211.046 88.9543 220 100 220H200C211.046 220 220 211.046 220 200V100C220 88.9543 211.046 80 200 80Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M160 50V40C160 29 151 20 140 20H40C29 20 20 29 20 40V140C20 151 29 160 40 160H50" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<rect x="70" y="123" width="74" height="10" transform="rotate(90 70 123)" fill="url(#paint0_linear_1939_21540)"/>
-<rect x="123" y="60" width="74" height="10" fill="url(#paint1_linear_1939_21540)"/>
-<defs>
-<linearGradient id="paint0_linear_1939_21540" x1="70" y1="127.25" x2="144" y2="127.25" gradientUnits="userSpaceOnUse">
-<stop stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#DD0031"/>
-<stop offset="1" stop-color="#DD0031" stop-opacity="0"/>
-</linearGradient>
-<linearGradient id="paint1_linear_1939_21540" x1="123" y1="64.25" x2="197" y2="64.25" gradientUnits="userSpaceOnUse">
-<stop stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#DD0031"/>
-<stop offset="1" stop-color="#DD0031" stop-opacity="0"/>
-</linearGradient>
-<clipPath id="clip0_1939_21540">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/1px-inner-gap.svg

@@ -1,5 +0,0 @@
-<svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0 10H120M0 20H120M0 30H120M5 0V120M0 40H120M15 0V120M0 50H120M25 0V120M0 60H120M35 0V120M0 70H120M45 0V120M0 80H120M55 0V120M0 90H120M65 0V120M0 100H120M75 0V120M0 110H120M85 0V120M95 0V120M105 0V120M115 0V120" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M35 89.9999L84.9998 59.9999L35 29.9999V89.9999Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<circle cx="52" cy="60" r="10" fill="#DD0031" fill-opacity="0.2" stroke="#DD0031" stroke-dasharray="1 1"/>
-</svg>

docs/images/1px-inner-spacing.svg

@@ -1,86 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_23527)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M79.9999 150V55C79.9999 46.7157 86.7157 40 94.9999 40C103.284 40 110 46.7157 110 55V105V35C110 26.7157 116.716 20 125 20C133.284 20 140 26.7157 140 35V100V55C140 46.7157 146.716 40 155 40C163.284 40 170 46.7157 170 55V110V75C170 66.7157 176.716 60 185 60C193.284 60 200 66.7157 200 75V154.75C200 190.786 170.786 220 134.75 220C112.5 220 91.1612 211.161 75.4282 195.428L37.4999 157.5C30.5964 150.596 30.5964 139.404 37.4999 132.5C44.4035 125.596 55.5964 125.596 62.4999 132.5L89.9999 160" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<rect x="47.917" y="132.154" width="74" height="15.4386" transform="rotate(45 47.917 132.154)" fill="url(#paint0_linear_1940_23527)"/>
-<rect x="190" y="66" width="74" height="10" transform="rotate(90 190 66)" fill="url(#paint1_linear_1940_23527)"/>
-<rect x="160" y="49" width="74" height="10" transform="rotate(90 160 49)" fill="url(#paint2_linear_1940_23527)"/>
-<rect x="130" y="36" width="74" height="10" transform="rotate(90 130 36)" fill="url(#paint3_linear_1940_23527)"/>
-<rect x="100" y="49" width="74" height="10" transform="rotate(90 100 49)" fill="url(#paint4_linear_1940_23527)"/>
-<defs>
-<linearGradient id="paint0_linear_1940_23527" x1="47.917" y1="138.716" x2="121.917" y2="138.716" gradientUnits="userSpaceOnUse">
-<stop stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#DD0031"/>
-<stop offset="1" stop-color="#DD0031" stop-opacity="0"/>
-</linearGradient>
-<linearGradient id="paint1_linear_1940_23527" x1="190" y1="70.25" x2="264" y2="70.25" gradientUnits="userSpaceOnUse">
-<stop stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#DD0031"/>
-<stop offset="1" stop-color="#DD0031" stop-opacity="0"/>
-</linearGradient>
-<linearGradient id="paint2_linear_1940_23527" x1="160" y1="53.25" x2="234" y2="53.25" gradientUnits="userSpaceOnUse">
-<stop stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#DD0031"/>
-<stop offset="1" stop-color="#DD0031" stop-opacity="0"/>
-</linearGradient>
-<linearGradient id="paint3_linear_1940_23527" x1="130" y1="40.25" x2="204" y2="40.25" gradientUnits="userSpaceOnUse">
-<stop stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#DD0031"/>
-<stop offset="1" stop-color="#DD0031" stop-opacity="0"/>
-</linearGradient>
-<linearGradient id="paint4_linear_1940_23527" x1="100" y1="53.25" x2="174" y2="53.25" gradientUnits="userSpaceOnUse">
-<stop stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#DD0031"/>
-<stop offset="1" stop-color="#DD0031" stop-opacity="0"/>
-</linearGradient>
-<clipPath id="clip0_1940_23527">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/1px-padding-violation.svg

@@ -1,67 +0,0 @@
-<svg width="244" height="184" viewBox="0 0 244 184" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1946_25554)">
-<path d="M62 37H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M67 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 42H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M72 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 47H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M77 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 52H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M82 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 57H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M87 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 62H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M92 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 67H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M97 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 72H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M102 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 77H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M107 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 82H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M112 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 87H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M117 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 92H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M122 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 97H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M127 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 102H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M132 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 107H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M137 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 112H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M142 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 117H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M147 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 122H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M152 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 127H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M157 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 132H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M162 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 137H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M167 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 142H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M172 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M62 147H182" stroke="#D8D8D9" stroke-width="0.25"/>
-<path d="M177 32V152" stroke="#D8D8D9" stroke-width="0.25"/>
-</g>
-<mask id="mask0_1946_25554" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="42" y="12" width="160" height="160">
-<path d="M202 172H42V12H202V172ZM62 32V152H182V32H62Z" fill="#D9D9D9"/>
-</mask>
-<g mask="url(#mask0_1946_25554)">
-<path d="M67.025 109.508C71.455 109.519 75.2044 112.41 76.5079 116.403L121.576 136.912C121.704 136.97 121.842 137 121.982 137C122.121 137 122.258 136.97 122.385 136.913L167.39 116.438C168.677 112.446 172.406 109.544 176.83 109.509C182.353 109.465 186.865 113.907 186.909 119.43C186.932 122.436 186.082 125.384 184.46 127.916C182.845 130.436 180.535 132.435 177.808 133.67L177.808 133.671L130.657 155.123C130.653 155.124 130.648 155.126 130.644 155.128C127.923 156.362 124.97 157 121.982 157C118.994 157 116.041 156.362 113.32 155.128C113.316 155.126 113.311 155.125 113.306 155.123L66.0455 133.616C66.025 133.606 66.0048 133.597 65.9844 133.587C63.2939 132.341 61.0182 130.349 59.4263 127.85C57.8345 125.35 56.9928 122.447 57 119.484L57.004 119.226C57.1542 113.822 61.5884 109.495 67.025 109.508ZM176.83 82.0063C182.353 81.9627 186.865 86.4046 186.909 91.9272C186.932 94.9333 186.082 97.8822 184.46 100.414C182.845 102.934 180.535 104.933 177.808 106.168L130.657 127.621C130.653 127.623 130.648 127.625 130.644 127.626C127.923 128.86 124.97 129.498 121.982 129.498C118.994 129.498 116.041 128.86 113.32 127.626C113.316 127.624 113.311 127.622 113.306 127.62L66.0455 106.114C66.0251 106.104 66.0048 106.095 65.9844 106.085C63.2939 104.839 61.0182 102.847 59.4263 100.348C57.8345 97.8479 56.9927 94.9442 57 91.9814L57.004 91.7236C57.1541 86.3203 61.5884 81.9929 67.025 82.0063C71.4548 82.0174 75.2038 84.9075 76.5074 88.9009L121.576 109.41C121.704 109.468 121.842 109.498 121.982 109.498C122.121 109.498 122.258 109.468 122.385 109.411L167.39 88.936C168.677 84.944 172.406 82.0413 176.83 82.0063ZM121.955 47C121.814 47 121.675 47.0302 121.546 47.0889C121.544 47.09 121.541 47.0911 121.539 47.0923L83.3658 64.479L121.598 81.918L121.602 81.9194C121.73 81.978 121.869 82.0083 122.009 82.0083C122.15 82.0083 122.289 81.9781 122.418 81.9194L122.43 81.9141L160.642 64.5288L122.37 47.0923C122.367 47.0912 122.365 47.0899 122.363 47.0889C122.234 47.0302 122.095 47 121.955 47ZM187 64.5317C187 67.5358 186.127 70.4758 184.487 72.9937C182.868 75.48 180.568 77.4487 177.863 78.6665L130.712 100.118L130.711 100.118C127.979 101.363 125.012 102.008 122.009 102.008C119.002 102.008 116.03 101.362 113.295 100.113V100.112L66.1475 78.6079L66.148 78.6074C63.446 77.3893 61.1496 75.4222 59.5318 72.9385C57.8917 70.4206 57.0191 67.4806 57.0191 64.4766C57.0191 61.4725 57.8917 58.5325 59.5318 56.0146L59.6875 55.7803C61.2965 53.4056 63.5343 51.5227 66.1529 50.3433H66.1524L113.24 28.8955V28.895C115.976 27.6462 118.948 27 121.955 27C124.962 27 127.934 27.6462 130.669 28.895L130.669 28.8955L177.868 50.3984L177.867 50.3989C180.485 51.5783 182.723 53.4606 184.332 55.835L184.487 56.0698L184.639 56.3066C186.181 58.7712 187 61.6215 187 64.5317Z" fill="#DD0031" fill-opacity="0.2" stroke="#DD0031" stroke-width="0.5" stroke-dasharray="0.5 0.5"/>
-</g>
-<path d="M67 92.0063C66.9974 93.0583 67.2963 94.0891 67.8612 94.9762C68.4262 95.8634 69.2335 96.5698 70.1874 97.0117L117.448 118.518C118.873 119.164 120.418 119.498 121.982 119.498C123.546 119.498 125.091 119.164 126.516 118.518L173.667 97.0667C174.64 96.629 175.464 95.9176 176.04 95.019C176.615 94.1205 176.918 93.0737 176.909 92.0063M67 119.508C66.9974 120.56 67.2963 121.591 67.8612 122.478C68.4262 123.366 69.2335 124.072 70.1874 124.514L117.448 146.02C118.873 146.666 120.418 147 121.982 147C123.546 147 125.091 146.666 126.516 146.02L173.667 124.569C174.64 124.131 175.464 123.42 176.04 122.521C176.615 121.623 176.918 120.576 176.909 119.508M126.516 37.992C125.084 37.3383 123.528 37 121.955 37C120.381 37 118.825 37.3383 117.393 37.992L70.2972 59.4437C69.3221 59.8741 68.493 60.579 67.9109 61.4726C67.3289 62.3662 67.019 63.4099 67.019 64.4766C67.019 65.5433 67.3289 66.587 67.9109 67.4806C68.493 68.3742 69.3221 69.0791 70.2972 69.5095L117.448 91.0162C118.88 91.6699 120.436 92.0082 122.009 92.0082C123.583 92.0082 125.139 91.6699 126.571 91.0162L173.722 69.5645C174.697 69.1341 175.526 68.4292 176.108 67.5356C176.69 66.642 177 65.5983 177 64.5316C177 63.4649 176.69 62.4212 176.108 61.5276C175.526 60.634 174.697 59.9291 173.722 59.4987L126.516 37.992Z" stroke="black" stroke-width="10" stroke-linecap="round" stroke-linejoin="round"/>
-<mask id="path-50-inside-1_1946_25554" fill="white">
-<path d="M182 32V152H62V32H182ZM67 147H177V37H67V147Z"/>
-</mask>
-<path d="M182 32V152H62V32H182ZM67 147H177V37H67V147Z" fill="#DD0031" fill-opacity="0.5"/>
-<path d="M182 32H183V31H182V32ZM182 152V153H183V152H182ZM62 152H61V153H62V152ZM62 32V31H61V32H62ZM67 147H66V148H67V147ZM177 147V148H178V147H177ZM177 37H178V36H177V37ZM67 37V36H66V37H67ZM182 32H181V152H182H183V32H182ZM182 152V151H62V152V153H182V152ZM62 152H63V32H62H61V152H62ZM62 32V33H182V32V31H62V32ZM67 147V148H177V147V146H67V147ZM177 147H178V37H177H176V147H177ZM177 37V36H67V37V38H177V37ZM67 37H66V147H67H68V37H67Z" fill="#DD0031" fill-opacity="0.25" mask="url(#path-50-inside-1_1946_25554)"/>
-<defs>
-<clipPath id="clip0_1946_25554">
-<rect width="120" height="120" fill="white" transform="translate(62 32)"/>
-</clipPath>
-</defs>
-</svg>

docs/images/24px-24px-violation.svg

@@ -1,9 +0,0 @@
-<svg width="244" height="88" viewBox="0 0 244 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M45.8333 32H27.1667C25.6939 32 24.5 33.1939 24.5 34.6667V53.3333C24.5 54.8061 25.6939 56 27.1667 56H45.8333C47.3061 56 48.5 54.8061 48.5 53.3333V34.6667C48.5 33.1939 47.3061 32 45.8333 32Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M68.9545 34.7273L63.3295 55.625H61.054L66.679 34.7273H68.9545Z" fill="black"/>
-<path d="M96.6111 40H90.3889C89.898 40 89.5 40.398 89.5 40.8889V47.1111C89.5 47.602 89.898 48 90.3889 48H96.6111C97.102 48 97.5 47.602 97.5 47.1111V40.8889C97.5 40.398 97.102 40 96.6111 40Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M125.955 34.7273L120.33 55.625H118.054L123.679 34.7273H125.955Z" fill="black"/>
-<path d="M154.5 34H146.5C145.395 34 144.5 34.8954 144.5 36V52C144.5 53.1046 145.395 54 146.5 54H154.5C155.605 54 156.5 53.1046 156.5 52V36C156.5 34.8954 155.605 34 154.5 34Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M182.955 34.7273L177.33 55.625H175.054L180.679 34.7273H182.955Z" fill="black"/>
-<path d="M215.5 38H199.5C198.395 38 197.5 38.8954 197.5 40V48C197.5 49.1046 198.395 50 199.5 50H215.5C216.605 50 217.5 49.1046 217.5 48V40C217.5 38.8954 216.605 38 215.5 38Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

docs/images/24px-24px.svg

@@ -1,4 +1,74 @@
-<svg width="244" height="88" viewBox="0 0 244 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M91 35H77C75.8954 35 75 35.8954 75 37V51C75 52.1046 75.8954 53 77 53H91C92.1046 53 93 52.1046 93 51V37C93 35.8954 92.1046 35 91 35Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M109.7 51V49.4091L114.622 44.3097C115.147 43.7557 115.581 43.2704 115.922 42.8537C116.267 42.4323 116.525 42.0322 116.696 41.6534C116.866 41.2746 116.951 40.8722 116.951 40.446C116.951 39.9631 116.838 39.5464 116.61 39.196C116.383 38.8409 116.073 38.5687 115.68 38.3793C115.287 38.1851 114.844 38.0881 114.352 38.0881C113.831 38.0881 113.377 38.1946 112.988 38.4077C112.6 38.6207 112.302 38.9214 112.093 39.3097C111.885 39.6979 111.781 40.1525 111.781 40.6733H109.686C109.686 39.7879 109.889 39.0137 110.297 38.3509C110.704 37.688 111.262 37.1742 111.973 36.8097C112.683 36.4403 113.49 36.2557 114.395 36.2557C115.308 36.2557 116.113 36.438 116.809 36.8026C117.51 37.1624 118.057 37.6548 118.45 38.2798C118.843 38.9001 119.039 39.6009 119.039 40.3821C119.039 40.9219 118.938 41.4498 118.734 41.9659C118.535 42.482 118.187 43.0573 117.69 43.6918C117.193 44.3215 116.502 45.0862 115.616 45.9858L112.725 49.0114V49.1179H119.274V51H109.7ZM121.348 48.1591V46.3835L127.633 36.4545H129.032V39.0682H128.145L123.649 46.1847V46.2983H132.264V48.1591H121.348ZM128.244 51V47.6193L128.258 46.8097V36.4545H130.339V51H128.244ZM143.411 48.5852L135.243 40.4176L136.586 39.0753L144.753 47.2429L143.411 48.5852ZM136.586 48.5852L135.243 47.2429L143.411 39.0753L144.753 40.4176L136.586 48.5852ZM148.059 51V49.4091L152.981 44.3097C153.507 43.7557 153.94 43.2704 154.281 42.8537C154.627 42.4323 154.885 42.0322 155.055 41.6534C155.225 41.2746 155.311 40.8722 155.311 40.446C155.311 39.9631 155.197 39.5464 154.97 39.196C154.743 38.8409 154.432 38.5687 154.039 38.3793C153.646 38.1851 153.204 38.0881 152.711 38.0881C152.19 38.0881 151.736 38.1946 151.348 38.4077C150.959 38.6207 150.661 38.9214 150.453 39.3097C150.244 39.6979 150.14 40.1525 150.14 40.6733H148.045C148.045 39.7879 148.249 39.0137 148.656 38.3509C149.063 37.688 149.622 37.1742 150.332 36.8097C151.042 36.4403 151.85 36.2557 152.754 36.2557C153.668 36.2557 154.473 36.438 155.169 36.8026C155.869 37.1624 156.416 37.6548 156.809 38.2798C157.202 38.9001 157.399 39.6009 157.399 40.3821C157.399 40.9219 157.297 41.4498 157.093 41.9659C156.895 42.482 156.547 43.0573 156.049 43.6918C155.552 44.3215 154.861 45.0862 153.975 45.9858L151.085 49.0114V49.1179H157.633V51H148.059ZM159.707 48.1591V46.3835L165.993 36.4545H167.392V39.0682H166.504L162.008 46.1847V46.2983H170.623V48.1591H159.707ZM166.603 51V47.6193L166.618 46.8097V36.4545H168.699V51H166.603Z" fill="black"/>
+<svg width="480" height="480" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill="#3C3C43" d="M0 0h480v480H0z"/>
+  <g clip-path="url(#a)">
+    <rect x="120" y="120" width="240" height="240" rx="8" fill="#F5F5F5"/>
+    <path d="M120 130h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M130 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 140h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M140 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 150h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M150 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 160h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M160 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 170h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M170 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 180h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M180 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 190h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M190 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 200h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M200 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 210h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M210 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 220h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M220 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 230h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M230 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 240h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M240 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 250h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M250 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 260h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M260 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 270h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M270 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 280h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M280 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 290h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M290 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 300h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M300 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 310h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M310 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 320h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M320 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 330h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M330 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 340h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M340 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M120 350h240" stroke="#D8D8D9" stroke-width=".5"/>
+    <path d="M350 120v240" stroke="#D8D8D9" stroke-width=".5"/>
+</g>
+<g id="embed-lucide-layers" stroke="#3C3C43" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" transform="translate(120 120), scale(10)">
+  <path d="M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z" />
+  <path d="M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12" />
+  <path d="M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17" />
+</g>
+  <g opacity=".5" stroke="#fff" stroke-width="3">
+    <path d="M120 92v16"/>
+    <path d="M360 92v16"/>
+    <path d="M120 100h240"/>
+  </g>
+  <g opacity=".5" stroke="#fff" stroke-width="3">
+    <path d="M387.922 120h-16"/>
+    <path d="M387.922 360h-16"/>
+    <path d="M379.922 120v240"/>
+  </g>
+  <path d="M203.395 86v-3.435l8.025-7.43a30.442 30.442 0 0 0 1.718-1.784c.47-.528.825-1.046 1.068-1.552a3.851 3.851 0 0 0 .363-1.662c0-.66-.151-1.23-.451-1.707a2.964 2.964 0 0 0-1.233-1.112c-.521-.264-1.112-.396-1.773-.396-.69 0-1.291.14-1.805.419-.514.278-.91.678-1.189 1.2-.279.52-.418 1.14-.418 1.86h-4.525c0-1.475.334-2.756 1.002-3.842.668-1.086 1.603-1.927 2.807-2.521 1.204-.594 2.591-.892 4.161-.892 1.615 0 3.02.286 4.217.859 1.203.565 2.139 1.35 2.807 2.356.668 1.005 1.002 2.157 1.002 3.456 0 .852-.169 1.692-.507 2.521-.33.83-.921 1.75-1.772 2.764-.852 1.005-2.052 2.212-3.6 3.621L210 81.95v.154h9.468V86h-16.073Zm18.701-3.963v-3.754l9.412-14.828h3.237v5.196h-1.916l-5.933 9.39v.176h13.375v3.82h-18.175ZM232.917 86v-5.108l.088-1.662V63.454h4.47V86h-4.558Zm10.574 6.34V69.09h4.624v2.841h.209c.205-.455.503-.917.892-1.387.396-.477.91-.873 1.541-1.189.638-.323 1.431-.484 2.378-.484 1.232 0 2.37.323 3.412.969 1.042.638 1.875 1.603 2.499 2.895.624 1.284.936 2.895.936 4.832 0 1.887-.305 3.48-.914 4.778-.602 1.292-1.424 2.272-2.466 2.94-1.035.66-2.194.99-3.478.99-.911 0-1.685-.15-2.323-.451-.631-.301-1.149-.679-1.552-1.134a5.755 5.755 0 0 1-.925-1.398h-.143v9.049h-4.69Zm4.591-14.794c0 1.005.139 1.882.418 2.63.279.75.682 1.332 1.211 1.75.528.412 1.17.617 1.926.617.764 0 1.409-.209 1.938-.627.528-.426.928-1.013 1.2-1.761.279-.756.418-1.626.418-2.61 0-.976-.136-1.834-.407-2.576-.272-.74-.672-1.32-1.2-1.739-.529-.418-1.178-.627-1.949-.627-.763 0-1.409.202-1.937.605-.521.404-.921.976-1.2 1.717-.279.742-.418 1.615-.418 2.62Zm18.34-8.455 3.104 5.912 3.182-5.912h4.81l-4.898 8.455L277.651 86h-4.789l-3.336-5.846-3.28 5.846h-4.844l5.02-8.454-4.844-8.455h4.844Z" fill="#fff"/>
+  <path d="M392.239 251.5v-3.435l8.025-7.43a30.403 30.403 0 0 0 1.718-1.784c.469-.528.825-1.046 1.067-1.552a3.839 3.839 0 0 0 .364-1.662c0-.661-.151-1.23-.452-1.707a2.96 2.96 0 0 0-1.233-1.111c-.521-.265-1.111-.397-1.772-.397-.69 0-1.292.14-1.805.419-.514.278-.91.678-1.189 1.199-.279.522-.419 1.142-.419 1.861h-4.524c0-1.475.334-2.756 1.002-3.842.667-1.086 1.603-1.927 2.807-2.521 1.203-.594 2.59-.892 4.161-.892 1.615 0 3.02.287 4.216.859 1.204.565 2.14 1.35 2.807 2.356.668 1.005 1.002 2.157 1.002 3.456 0 .852-.169 1.692-.506 2.521-.33.83-.921 1.751-1.773 2.764-.851 1.005-2.051 2.212-3.599 3.621l-3.292 3.226v.154h9.467v3.897h-16.072Zm18.701-3.963v-3.754l9.412-14.828h3.237v5.196h-1.916l-5.934 9.39v.176h13.376v3.82H410.94Zm10.821 3.963v-5.108l.088-1.662v-15.775h4.47V251.5h-4.558Zm10.574 6.341v-23.25h4.623v2.84h.21c.205-.455.502-.917.891-1.387.397-.477.91-.873 1.541-1.189.639-.323 1.432-.484 2.378-.484 1.233 0 2.371.323 3.413.968 1.042.639 1.875 1.604 2.499 2.896.624 1.284.936 2.895.936 4.832 0 1.887-.305 3.479-.914 4.778-.602 1.292-1.424 2.272-2.466 2.939-1.035.661-2.194.991-3.479.991-.91 0-1.684-.15-2.323-.451-.631-.301-1.148-.679-1.552-1.134a5.736 5.736 0 0 1-.924-1.398h-.144v9.049h-4.689Zm4.59-14.796c0 1.006.14 1.883.419 2.631.279.749.682 1.333 1.211 1.751.528.411 1.17.616 1.926.616.763 0 1.409-.209 1.938-.627.528-.426.928-1.013 1.2-1.762.278-.755.418-1.625.418-2.609 0-.976-.136-1.834-.407-2.576-.272-.741-.672-1.321-1.2-1.739-.529-.418-1.178-.627-1.949-.627-.763 0-1.409.201-1.937.605-.521.404-.921.976-1.2 1.717-.279.742-.419 1.615-.419 2.62Zm18.341-8.454 3.104 5.911 3.181-5.911h4.811l-4.899 8.454 5.031 8.455h-4.788l-3.336-5.846-3.281 5.846h-4.843l5.02-8.455-4.844-8.454h4.844Z" fill="#fff"/>
+  <defs>
+    <clipPath id="a">
+      <rect x="120" y="120" width="240" height="240" rx="8" fill="#fff"/>
+    </clipPath>
+  </defs>
 </svg>

docs/images/2px-inner-gap.svg

@@ -1,5 +0,0 @@
-<svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0 10H120M0 20H120M0 30H120M5 0V120M0 40H120M15 0V120M0 50H120M25 0V120M0 60H120M35 0V120M0 70H120M45 0V120M0 80H120M55 0V120M0 90H120M65 0V120M0 100H120M75 0V120M0 110H120M85 0V120M95 0V120M105 0V120M115 0V120" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M85.33 54.4001C86.3121 54.9683 87.1274 55.7849 87.6943 56.7678C88.2611 57.7507 88.5595 58.8654 88.5595 60.0001C88.5595 61.1347 88.2611 62.2494 87.6943 63.2323C87.1274 64.2152 86.3121 65.0318 85.33 65.6001L44.68 89.1201C43.6983 89.688 42.5842 89.9871 41.4501 89.9871C40.3159 89.9871 39.2018 89.6881 38.2201 89.1202C37.2384 88.5522 36.4238 87.7355 35.8585 86.7523C35.2931 85.7691 34.997 84.6542 35 83.5201V36.4801C34.998 35.3474 35.2944 34.2342 35.8592 33.2524C36.424 32.2706 37.2375 31.4548 38.2176 30.8872C39.1978 30.3196 40.3102 30.0201 41.4429 30.0188C42.5756 30.0175 43.6886 30.3146 44.67 30.8801L85.33 54.4001Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<circle cx="55" cy="60" r="10" fill="#41B883" fill-opacity="0.2" stroke="#41B883" stroke-dasharray="1 1"/>
-</svg>

docs/images/2px-inner-spacing.svg

@@ -1,86 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_23515)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M180 110V60C180 54.6957 177.893 49.6086 174.142 45.8579C170.391 42.1071 165.304 40 160 40C154.696 40 149.609 42.1071 145.858 45.8579C142.107 49.6086 140 54.6957 140 60M140 100V40C140 34.6957 137.893 29.6086 134.142 25.8579C130.391 22.1071 125.304 20 120 20C114.696 20 109.609 22.1071 105.858 25.8579C102.107 29.6086 100 34.6957 100 40V60M100 60V105M100 60C100 54.6957 97.8929 49.6086 94.1422 45.8579C90.3915 42.1071 85.3044 40 80.0001 40C74.6957 40 69.6086 42.1071 65.8579 45.8579C62.1072 49.6086 60.0001 54.6957 60.0001 60V140M180 80C180 74.6957 182.107 69.6086 185.858 65.8579C189.609 62.1071 194.696 60 200 60C205.304 60 210.391 62.1071 214.142 65.8579C217.893 69.6086 220 74.6957 220 80V140C220 161.217 211.572 181.566 196.569 196.569C181.566 211.571 161.217 220 140 220H120C92.0001 220 75.0001 211.4 60.1001 196.6L24.1001 160.6C20.6594 156.789 18.8159 151.802 18.9513 146.669C19.0867 141.537 21.1905 136.653 24.8273 133.03C28.464 129.406 33.3551 127.319 38.4878 127.202C43.6205 127.085 48.6017 128.946 52.4001 132.4L70.0001 150" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<rect x="170" y="49" width="74" height="20" transform="rotate(90 170 49)" fill="url(#paint0_linear_1940_23515)"/>
-<rect x="130" y="36" width="74" height="20" transform="rotate(90 130 36)" fill="url(#paint1_linear_1940_23515)"/>
-<rect x="90" y="60" width="74" height="20" transform="rotate(90 90 60)" fill="url(#paint2_linear_1940_23515)"/>
-<rect x="210" y="70" width="74" height="20" transform="rotate(90 210 70)" fill="url(#paint3_linear_1940_23515)"/>
-<rect x="40.1426" y="134" width="74" height="20" transform="rotate(45 40.1426 134)" fill="url(#paint4_linear_1940_23515)"/>
-<defs>
-<linearGradient id="paint0_linear_1940_23515" x1="170" y1="57.5" x2="244" y2="57.5" gradientUnits="userSpaceOnUse">
-<stop stop-color="#41B883" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#41B883"/>
-<stop offset="1" stop-color="#41B883" stop-opacity="0"/>
-</linearGradient>
-<linearGradient id="paint1_linear_1940_23515" x1="130" y1="44.5" x2="204" y2="44.5" gradientUnits="userSpaceOnUse">
-<stop stop-color="#41B883" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#41B883"/>
-<stop offset="1" stop-color="#41B883" stop-opacity="0"/>
-</linearGradient>
-<linearGradient id="paint2_linear_1940_23515" x1="90" y1="68.5" x2="164" y2="68.5" gradientUnits="userSpaceOnUse">
-<stop stop-color="#41B883" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#41B883"/>
-<stop offset="1" stop-color="#41B883" stop-opacity="0"/>
-</linearGradient>
-<linearGradient id="paint3_linear_1940_23515" x1="210" y1="78.5" x2="284" y2="78.5" gradientUnits="userSpaceOnUse">
-<stop stop-color="#41B883" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#41B883"/>
-<stop offset="1" stop-color="#41B883" stop-opacity="0"/>
-</linearGradient>
-<linearGradient id="paint4_linear_1940_23515" x1="40.1426" y1="142.5" x2="114.143" y2="142.5" gradientUnits="userSpaceOnUse">
-<stop stop-color="#41B883" stop-opacity="0"/>
-<stop offset="0.499255" stop-color="#41B883"/>
-<stop offset="1" stop-color="#41B883" stop-opacity="0"/>
-</linearGradient>
-<clipPath id="clip0_1940_23515">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/border-radius-90deg.svg

@@ -1,65 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_24360)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M27.0001 103C24.7596 105.238 22.9822 107.896 21.7695 110.822C20.5568 113.747 19.9326 116.883 19.9326 120.05C19.9326 123.217 20.5568 126.353 21.7695 129.278C22.9822 132.204 24.7596 134.862 27.0001 137.1L102.9 213C105.138 215.241 107.796 217.018 110.722 218.231C113.647 219.443 116.783 220.068 119.95 220.068C123.117 220.068 126.253 219.443 129.178 218.231C132.104 217.018 134.762 215.241 137 213L212.9 137.1C215.141 134.862 216.918 132.204 218.131 129.278C219.343 126.353 219.968 123.217 219.968 120.05C219.968 116.883 219.343 113.747 218.131 110.822C216.918 107.896 215.141 105.238 212.9 103L137 27.1001C134.762 24.8595 132.104 23.0821 129.178 21.8695C126.253 20.6568 123.117 20.0326 119.95 20.0326C116.783 20.0326 113.647 20.6568 110.722 21.8695C107.796 23.0821 105.138 24.8595 102.9 27.1001L27.0001 103Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M27.0001 103C24.7596 105.238 22.9822 107.896 21.7695 110.822C20.5568 113.747 19.9326 116.883 19.9326 120.05C19.9326 123.217 20.5568 126.353 21.7695 129.278C22.9822 132.204 24.7596 134.862 27.0001 137.1L102.9 213C105.138 215.241 107.796 217.018 110.722 218.231C113.647 219.443 116.783 220.068 119.95 220.068C123.117 220.068 126.253 219.443 129.178 218.231C132.104 217.018 134.762 215.241 137 213L212.9 137.1C215.141 134.862 216.918 132.204 218.131 129.278C219.343 126.353 219.968 123.217 219.968 120.05C219.968 116.883 219.343 113.747 218.131 110.822C216.918 107.896 215.141 105.238 212.9 103L137 27.1001C134.762 24.8595 132.104 23.0821 129.178 21.8695C126.253 20.6568 123.117 20.0326 119.95 20.0326C116.783 20.0326 113.647 20.6568 110.722 21.8695C107.796 23.0821 105.138 24.8595 102.9 27.1001L27.0001 103Z" stroke="#41B883" stroke-linecap="round" stroke-linejoin="round"/>
-<circle opacity="0.5" cx="120.1" cy="44.1" r="24.1" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="120.1" cy="196.1" r="24.1" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="44.1" cy="120.1" r="24.1" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="196.1" cy="120.1" r="24.1" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle cx="120" cy="44" r="1" fill="#41B883"/>
-<circle cx="120" cy="196" r="1" fill="#41B883"/>
-<circle cx="44" cy="120" r="1" fill="#41B883"/>
-<circle cx="196" cy="120" r="1" fill="#41B883"/>
-<defs>
-<clipPath id="clip0_1940_24360">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/border-radius-arbitrary.svg

@@ -1,63 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_24578)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M159.14 40.0001C160.271 36.7937 160.28 33.2981 159.164 30.0862C158.048 26.8744 155.875 24.1368 152.999 22.3225C150.123 20.5081 146.717 19.7245 143.337 20.1002C139.958 20.4758 136.807 21.9885 134.4 24.3901L44.3997 114.39C42.3012 116.487 40.8717 119.16 40.292 122.069C39.7124 124.979 40.0086 127.995 41.1432 130.737C42.2778 133.478 44.1999 135.821 46.6664 137.47C49.1328 139.119 52.0329 139.999 54.9997 140H95.0197C95.8185 140.001 96.6054 140.193 97.3145 140.561C98.0237 140.929 98.6344 141.461 99.0956 142.113C99.5568 142.765 99.8551 143.518 99.9654 144.309C100.076 145.101 99.9949 145.907 99.7297 146.66L80.8597 200C79.7278 203.208 79.7196 206.705 80.8365 209.917C81.9534 213.13 84.129 215.868 87.0065 217.681C89.8839 219.495 93.2924 220.277 96.6726 219.899C100.053 219.521 103.204 218.005 105.61 215.6L195.61 125.6C197.705 123.502 199.132 120.829 199.71 117.92C200.287 115.011 199.989 111.997 198.854 109.257C197.718 106.517 195.796 104.176 193.33 102.528C190.864 100.88 187.965 100.001 185 100H145.03C144.229 100.001 143.44 99.81 142.728 99.4425C142.017 99.075 141.404 98.542 140.941 97.8883C140.479 97.2346 140.18 96.4794 140.07 95.6862C139.96 94.8929 140.042 94.0849 140.31 93.3301L159.14 40.0001Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M159.14 40.0001C160.271 36.7937 160.28 33.2981 159.164 30.0862C158.048 26.8744 155.875 24.1368 152.999 22.3225C150.123 20.5081 146.717 19.7245 143.337 20.1002C139.958 20.4758 136.807 21.9885 134.4 24.3901L44.3997 114.39C42.3012 116.487 40.8717 119.16 40.292 122.069C39.7124 124.979 40.0086 127.995 41.1432 130.737C42.2778 133.478 44.1999 135.821 46.6664 137.47C49.1328 139.119 52.0329 139.999 54.9997 140H95.0197C95.8185 140.001 96.6054 140.193 97.3145 140.561C98.0237 140.929 98.6344 141.461 99.0956 142.113C99.5568 142.765 99.8551 143.518 99.9654 144.309C100.076 145.101 99.9949 145.907 99.7297 146.66L80.8597 200C79.7278 203.208 79.7196 206.705 80.8365 209.917C81.9534 213.13 84.129 215.868 87.0065 217.681C89.8839 219.495 93.2924 220.277 96.6726 219.899C100.053 219.521 103.204 218.005 105.61 215.6L195.61 125.6C197.705 123.502 199.132 120.829 199.71 117.92C200.287 115.011 199.989 111.997 198.854 109.257C197.718 106.517 195.796 104.176 193.33 102.528C190.864 100.88 187.965 100.001 185 100H145.03C144.229 100.001 143.44 99.81 142.728 99.4425C142.017 99.075 141.404 98.542 140.941 97.8883C140.479 97.2346 140.18 96.4794 140.07 95.6862C139.96 94.8929 140.042 94.0849 140.31 93.3301L159.14 40.0001Z" stroke="#41B883" stroke-linecap="round" stroke-linejoin="round"/>
-<circle opacity="0.5" cx="145" cy="35" r="15" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="95" cy="205" r="15" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="55" cy="125" r="15" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="185" cy="115" r="15" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="145" cy="95" r="5" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="95" cy="145" r="5" stroke="#41B883" stroke-dasharray="1 1"/>
-</g>
-<defs>
-<clipPath id="clip0_1940_24578">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/border-radius-correct.svg

@@ -1,73 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_24902)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 160H120.1M160 160H160.1M80 160H80.1M30 190C30 195.304 32.1071 200.391 35.8579 204.142C39.6086 207.893 44.6957 210 50 210H190C195.304 210 200.391 207.893 204.142 204.142C207.893 200.391 210 195.304 210 190V85C210.001 84.103 209.761 83.2223 209.304 82.4501C208.848 81.678 208.192 81.0429 207.405 80.6114C206.619 80.1798 205.731 79.9678 204.835 79.9975C203.938 80.0271 203.066 80.2974 202.31 80.78L157.69 109.22C156.934 109.703 156.062 109.973 155.165 110.003C154.269 110.032 153.381 109.82 152.595 109.389C151.808 108.957 151.152 108.322 150.696 107.55C150.239 106.778 149.999 105.897 150 105V85C150.001 84.103 149.761 83.2223 149.304 82.4501C148.848 81.678 148.192 81.0429 147.405 80.6114C146.619 80.1798 145.731 79.9678 144.835 79.9975C143.938 80.0271 143.066 80.2974 142.31 80.78L97.7 109.22C96.9437 109.705 96.0707 109.978 95.1727 110.009C94.2747 110.04 93.3849 109.828 92.597 109.396C91.809 108.965 91.152 108.328 90.695 107.555C90.238 106.781 89.9979 105.899 90 105V50C90 44.6957 87.8929 39.6086 84.1421 35.8579C80.3914 32.1071 75.3043 30 70 30H50C44.6957 30 39.6086 32.1071 35.8579 35.8579C32.1071 39.6086 30 44.6957 30 50V190Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M120 160H120.1M160 160H160.1M80 160H80.1M30 190C30 195.304 32.1071 200.391 35.8579 204.142C39.6086 207.893 44.6957 210 50 210H190C195.304 210 200.391 207.893 204.142 204.142C207.893 200.391 210 195.304 210 190V85C210.001 84.103 209.761 83.2223 209.304 82.4501C208.848 81.678 208.192 81.0429 207.405 80.6114C206.619 80.1798 205.731 79.9678 204.835 79.9975C203.938 80.0271 203.066 80.2974 202.31 80.78L157.69 109.22C156.934 109.703 156.062 109.973 155.165 110.003C154.269 110.032 153.381 109.82 152.595 109.389C151.808 108.957 151.152 108.322 150.696 107.55C150.239 106.778 149.999 105.897 150 105V85C150.001 84.103 149.761 83.2223 149.304 82.4501C148.848 81.678 148.192 81.0429 147.405 80.6114C146.619 80.1798 145.731 79.9678 144.835 79.9975C143.938 80.0271 143.066 80.2974 142.31 80.78L97.7 109.22C96.9437 109.705 96.0707 109.978 95.1727 110.009C94.2747 110.04 93.3849 109.828 92.597 109.396C91.809 108.965 91.152 108.328 90.695 107.555C90.238 106.781 89.9979 105.899 90 105V50C90 44.6957 87.8929 39.6086 84.1421 35.8579C80.3914 32.1071 75.3043 30 70 30H50C44.6957 30 39.6086 32.1071 35.8579 35.8579C32.1071 39.6086 30 44.6957 30 50V190Z" stroke="#41B883" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-<circle opacity="0.5" cx="50" cy="50" r="20" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle cx="50" cy="50" r="1" fill="#41B883"/>
-<circle opacity="0.5" cx="70" cy="50" r="20" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle cx="70" cy="50" r="1" fill="#41B883"/>
-<circle opacity="0.5" cx="50" cy="190" r="20" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle cx="50" cy="190" r="1" fill="#41B883"/>
-<circle opacity="0.5" cx="190" cy="190" r="20" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle cx="190" cy="190" r="1" fill="#41B883"/>
-<circle cx="205" cy="85" r="1" fill="#41B883"/>
-<circle cx="145" cy="85" r="1" fill="#41B883"/>
-<circle cx="95" cy="105" r="1" fill="#41B883"/>
-<circle cx="155" cy="105" r="1" fill="#41B883"/>
-<circle opacity="0.5" cx="205" cy="85" r="5" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="145" cy="85" r="5" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="95" cy="105" r="5" stroke="#41B883" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="155" cy="105" r="5" stroke="#41B883" stroke-dasharray="1 1"/>
-<defs>
-<clipPath id="clip0_1940_24902">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/border-radius-line-join-violation.svg

@@ -1,65 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_24730)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<g clip-path="url(#clip1_1940_24730)">
-<path d="M160 80.0001L20 220M174.88 150H90M140.86 184.12C139.003 185.983 136.796 187.462 134.366 188.471C131.936 189.48 129.331 190 126.7 190H50V113.28C50.0011 107.976 52.109 102.89 55.86 99.1401L117.5 37.5001C128.758 26.2417 144.028 19.9167 159.95 19.9167C175.872 19.9167 191.142 26.2417 202.4 37.5001C213.658 48.7586 219.983 64.0283 219.983 79.9501C219.983 95.872 213.658 111.142 202.4 122.4L140.86 184.12Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M160 80.0001L20 220M174.88 150H90M140.86 184.12C139.003 185.983 136.796 187.462 134.366 188.471C131.936 189.48 129.331 190 126.7 190L70 190C58.9543 190 50 181.046 50 170V113.28C50.0011 107.976 52.109 102.89 55.86 99.1401L117.5 37.5001C128.758 26.2417 144.028 19.9167 159.95 19.9167C175.872 19.9167 191.142 26.2417 202.4 37.5001C213.658 48.7586 219.983 64.0283 219.983 79.9501C219.983 95.872 213.658 111.142 202.4 122.4L140.86 184.12Z" stroke="#DD0031" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-</g>
-<path opacity="0.5" d="M70 190C58.9543 190 50 181.046 50 170" stroke="#DD0031" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="50" cy="190" r="30" stroke="#DD0031" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="70" cy="170" r="20" fill="#DD0031"/>
-<defs>
-<clipPath id="clip0_1940_24730">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-<clipPath id="clip1_1940_24730">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/border-radius-line-join.svg

@@ -1,63 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_24655)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<g clip-path="url(#clip1_1940_24655)">
-<path d="M160 80.0001L20 220M174.88 150H90M140.86 184.12C139.003 185.983 136.796 187.462 134.366 188.471C131.936 189.48 129.331 190 126.7 190H50V113.28C50.0011 107.976 52.109 102.89 55.86 99.1401L117.5 37.5001C128.758 26.2417 144.028 19.9167 159.95 19.9167C175.872 19.9167 191.142 26.2417 202.4 37.5001C213.658 48.7586 219.983 64.0283 219.983 79.9501C219.983 95.872 213.658 111.142 202.4 122.4L140.86 184.12Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M160 80.0001L20 220M174.88 150H90M140.86 184.12C139.003 185.983 136.796 187.462 134.366 188.471C131.936 189.48 129.331 190 126.7 190H50V113.28C50.0011 107.976 52.109 102.89 55.86 99.1401L117.5 37.5001C128.758 26.2417 144.028 19.9167 159.95 19.9167C175.872 19.9167 191.142 26.2417 202.4 37.5001C213.658 48.7586 219.983 64.0283 219.983 79.9501C219.983 95.872 213.658 111.142 202.4 122.4L140.86 184.12Z" stroke="#41B883" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-</g>
-<circle opacity="0.5" cx="50" cy="190" r="30" stroke="#41B883" stroke-dasharray="1 1"/>
-<defs>
-<clipPath id="clip0_1940_24655">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-<clipPath id="clip1_1940_24655">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/border-radius-violation.svg

@@ -1,61 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_24990)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 160H120.1M160 160H160.1M31 30H90V110L150 80V110L210 80V210H30V30M80 160H80.1" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M120 160H120.1M160 160H160.1M31 30H90V110L150 80V110L210 80V210H30V30M80 160H80.1" stroke="#DD0031" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-<path opacity="0.5" d="M30 50C41.0457 50 50 41.0457 50 30" stroke="#DD0031" stroke-dasharray="1 1"/>
-<path opacity="0.5" d="M90 50C78.9543 50 70 41.0457 70 30" stroke="#DD0031" stroke-dasharray="1 1"/>
-<path opacity="0.5" d="M30 190C41.0457 190 50 198.954 50 210" stroke="#DD0031" stroke-dasharray="1 1"/>
-<path opacity="0.5" d="M210 190C198.954 190 190 198.954 190 210" stroke="#DD0031" stroke-dasharray="1 1"/>
-<defs>
-<clipPath id="clip0_1940_24990">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/centered-strokes-violation.svg

@@ -1,89 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_23370)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M30 30H210C215.523 30 220 34.4772 220 40V160C220 165.523 215.523 170 210 170H30C24.4772 170 20 165.523 20 160V40C20 34.4772 24.4772 30 30 30Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M30 30H210C215.523 30 220 34.4772 220 40V160C220 165.523 215.523 170 210 170H30C24.4772 170 20 165.523 20 160V40C20 34.4772 24.4772 30 30 30Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M80 210H160" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M120 170V210" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<circle cx="120" cy="100" r="30" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M240 210L0 210" stroke="#DD0031" stroke-dasharray="1 1"/>
-<path d="M80 210H160" stroke="#DD0031" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M120 240V180" stroke="#DD0031" stroke-dasharray="1 1"/>
-<path d="M120 180V210" stroke="#DD0031" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M240 20H0" stroke="#DD0031" stroke-dasharray="1 1"/>
-<path opacity="0.5" d="M240 180H0" stroke="#DD0031" stroke-dasharray="1 1"/>
-<path opacity="0.5" d="M9.99998 240L10 0" stroke="#DD0031" stroke-dasharray="1 1"/>
-<path opacity="0.5" d="M230 240L230 0" stroke="#DD0031" stroke-dasharray="1 1"/>
-<path d="M210 20H30C18.9543 20 10 28.9543 10 40V160C10 171.046 18.9543 180 30 180H210C221.046 180 230 171.046 230 160V40C230 28.9543 221.046 20 210 20Z" stroke="#DD0031" stroke-linecap="round" stroke-linejoin="round"/>
-<g filter="url(#filter0_i_1940_23370)">
-<path d="M210 20H30C18.9543 20 10 28.9543 10 40V160C10 171.046 18.9543 180 30 180H210C221.046 180 230 171.046 230 160V40C230 28.9543 221.046 20 210 20Z" fill="black" fill-opacity="0.01"/>
-</g>
-<path d="M140 100C140 111.046 131.046 120 120 120C108.954 120 100 111.046 100 100C100 88.9543 108.954 80 120 80C131.046 80 140 88.9543 140 100Z" stroke="#DD0031" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M160 100C160 122.091 142.091 140 120 140C97.9086 140 80 122.091 80 100C80 77.9086 97.9086 60 120 60C142.091 60 160 77.9086 160 100Z" fill="url(#paint0_radial_1940_23370)"/>
-<defs>
-<filter id="filter0_i_1940_23370" x="10" y="20" width="220" height="160" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset/>
-<feGaussianBlur stdDeviation="10"/>
-<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
-<feColorMatrix type="matrix" values="0 0 0 0 0.866667 0 0 0 0 0 0 0 0 0 0.192157 0 0 0 1 0"/>
-<feBlend mode="normal" in2="shape" result="effect1_innerShadow_1940_23370"/>
-</filter>
-<radialGradient id="paint0_radial_1940_23370" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(120 100) rotate(90) scale(40)">
-<stop offset="0.5" stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.5001" stop-color="#DD0031" stop-opacity="0.5"/>
-<stop offset="1" stop-color="#DD0031" stop-opacity="0"/>
-</radialGradient>
-<clipPath id="clip0_1940_23370">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/density-optimal.svg

@@ -1,21 +0,0 @@
-<svg width="196" height="88" viewBox="0 0 196 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M48 34V37M40 34V37M35 41H53M40 45H40.01M44 45H44.01M48 45H48.01M40 49H40.01M44 49H44.01M48 49H48.01M37 35H51C52.1046 35 53 35.8954 53 37V51C53 52.1046 52.1046 53 51 53H37C35.8954 53 35 52.1046 35 51V37C35 35.8954 35.8954 35 37 35Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M83 53V48C83 47.7348 82.8946 47.4804 82.7071 47.2929C82.5196 47.1054 82.2652 47 82 47H78C77.7348 47 77.4804 47.1054 77.2929 47.2929C77.1054 47.4804 77 47.7348 77 48V53" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M85.774 42.31C85.5655 42.1104 85.288 41.999 84.9995 41.999C84.7109 41.999 84.4334 42.1104 84.225 42.31C83.76 42.7535 83.142 43.001 82.4995 43.001C81.8569 43.001 81.2389 42.7535 80.774 42.31C80.5655 42.1107 80.2883 41.9995 80 41.9995C79.7116 41.9995 79.4344 42.1107 79.226 42.31C78.7609 42.7538 78.1428 43.0014 77.5 43.0014C76.8571 43.0014 76.239 42.7538 75.774 42.31C75.5655 42.1104 75.288 41.999 74.9995 41.999C74.7109 41.999 74.4334 42.1104 74.225 42.31C73.7758 42.7386 73.1832 42.9848 72.5626 43.0005C71.9419 43.0163 71.3376 42.8006 70.8673 42.3954C70.3969 41.9901 70.0941 41.4244 70.0179 40.8082C69.9417 40.1921 70.0975 39.5696 70.455 39.062L73.344 34.878C73.5273 34.6075 73.774 34.3861 74.0627 34.233C74.3514 34.0799 74.6732 33.9999 75 34H85C85.3257 33.9999 85.6466 34.0793 85.9347 34.2315C86.2228 34.3836 86.4694 34.6039 86.653 34.873L89.548 39.065C89.9055 39.573 90.0611 40.196 89.9844 40.8124C89.9077 41.4289 89.6042 41.9947 89.1331 42.3997C88.662 42.8046 88.057 43.0197 87.436 43.0029C86.815 42.9861 86.2225 42.7388 85.774 42.309" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M72 42.95V51C72 51.5304 72.2107 52.0391 72.5858 52.4142C72.9609 52.7892 73.4696 53 74 53H86C86.5304 53 87.0391 52.7892 87.4142 52.4142C87.7893 52.0391 88 51.5304 88 51V42.95" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M114.5 34C112.5 40.584 112.5 47.416 114.5 54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M117.5 34C119.5 40.584 119.5 47.416 117.5 54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M108.402 48H123.598" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M108.402 40H123.598" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M112 34C111.637 34 111.281 34.099 110.969 34.2862C110.658 34.4735 110.404 34.7421 110.233 35.063C108.766 37.8135 107.999 40.8828 107.998 44C107.997 47.1173 108.764 50.1868 110.229 52.938C110.4 53.259 110.654 53.5274 110.966 53.7145C111.277 53.9016 111.634 54.0003 111.997 54H120.003C120.367 54.0002 120.724 53.9014 121.035 53.7141C121.347 53.5268 121.601 53.2581 121.771 52.937C123.238 50.1864 124.005 47.1172 124.005 44.0002C124.005 40.8831 123.238 37.8138 121.772 35.063C121.601 34.7406 121.345 34.471 121.032 34.2837C120.719 34.0963 120.36 33.9982 119.995 34H112Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M152 54C157.523 54 162 49.5228 162 44C162 38.4772 157.523 34 152 34C146.477 34 142 38.4772 142 44C142 49.5228 146.477 54 152 54Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M152 46.5C153.381 46.5 154.5 45.3807 154.5 44C154.5 42.6193 153.381 41.5 152 41.5C150.619 41.5 149.5 42.6193 149.5 44C149.5 45.3807 150.619 46.5 152 46.5Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M152 34V41.5" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M159 37L153.77 42.23" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M162 44H154.5" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M159 51L153.77 45.77" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M152 46.5V54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M150.23 45.77L145 51" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M149.5 44H142" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M150.23 42.23L145 37" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

docs/images/density-too-dense.svg

@@ -1,29 +0,0 @@
-<svg width="196" height="88" viewBox="0 0 196 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M49 34V37M39 34V37M35 41H53M38 41V53M53 45L35 45M53 49L35 49M42 41V53M46 41V53M50 41V53M36 35H52C53.1046 35 54 35.8954 54 37V51C54 52.1046 53.1046 53 52 53H36C34.8954 53 34 52.1046 34 51V37C34 35.8954 34.8954 35 36 35Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M80 53V48C80 47.7348 79.8946 47.4804 79.7071 47.2929C79.5196 47.1054 79.2652 47 79 47H77C76.7348 47 76.4804 47.1054 76.2929 47.2929C76.1054 47.4804 76 47.7348 76 48V53" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M84.9995 41.999C85.448 42.4288 86.815 42.9861 87.436 43.0029C88.057 43.0197 88.662 42.8046 89.1331 42.3997C89.6042 41.9947 89.9077 41.4289 89.9844 40.8124C90.0611 40.196 89.9055 39.573 89.548 39.065L86.653 34.873C86.4694 34.6039 86.2228 34.3836 85.9347 34.2315C85.6466 34.0793 85.3257 33.9999 85 34L83.5 34M84.9995 41.999L83.5 34M84.9995 41.999C84.5 42.5 83.5282 43.001 82.4995 43.001C81.471 43.001 80.5 42.5 80 41.9995M80 41.9995V34M80 41.9995C79.5 42.5 78.5288 43.0014 77.5 43.0014C76.4708 43.0014 75.5 42.5 74.9995 41.999M74.9995 41.999L76.5 34M74.9995 41.999C74.5 42.5 73.5533 42.9754 72.5626 43.0005C71.9419 43.0163 71.3376 42.8006 70.8673 42.3954C70.3969 41.9901 70.0941 41.4244 70.0179 40.8082C69.9417 40.1921 70.0975 39.5696 70.455 39.062L73.344 34.878C73.5273 34.6075 73.774 34.3861 74.0627 34.233C74.3514 34.0799 74.6732 33.9999 75 34L76.5 34M76.5 34H80M80 34H83.5" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M72 42.95V51C72 51.5304 72.2107 52.0391 72.5858 52.4142C72.9609 52.7892 73.4696 53 74 53H86C86.5304 53 87.0391 52.7892 87.4142 52.4142C87.7893 52.0391 88 51.5304 88 51V42.95" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M84 47L84 47.01M84 50L84 50.01" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M114.5 34C112.5 40.584 112.5 47.416 114.5 54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M117.5 34C119.5 40.584 119.5 47.416 117.5 54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M109.027 50H122.936M109.027 38H122.936M108.402 42H123.598M108.402 46H123.598" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M112 34C111.637 34 111.281 34.099 110.969 34.2862C110.658 34.4735 110.404 34.7421 110.233 35.063C108.766 37.8135 107.999 40.8828 107.998 44C107.997 47.1173 108.764 50.1868 110.229 52.938C110.4 53.259 110.654 53.5274 110.966 53.7145C111.277 53.9016 111.634 54.0003 111.997 54H120.003C120.367 54.0002 120.724 53.9014 121.035 53.7141C121.347 53.5268 121.601 53.2581 121.771 52.937C123.238 50.1864 124.005 47.1172 124.005 44.0002C124.005 40.8831 123.238 37.8138 121.772 35.063C121.601 34.7406 121.345 34.471 121.032 34.2837C120.719 34.0963 120.36 33.9982 119.995 34H112Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<g clip-path="url(#clip0_1937_21192)">
-<path d="M152 54C157.523 54 162 49.5228 162 44C162 38.4772 157.523 34 152 34C146.477 34 142 38.4772 142 44C142 49.5228 146.477 54 152 54Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M152 46.5C153.381 46.5 154.5 45.3807 154.5 44C154.5 42.6193 153.381 41.5 152 41.5C150.619 41.5 149.5 42.6193 149.5 44C149.5 45.3807 150.619 46.5 152 46.5Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M152 34V41.5" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M159 37L153.77 42.23" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M162 44H154.5" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M159 51L153.77 45.77" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M152 46.5V54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M150.23 45.77L145 51" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M149.5 44H142" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M150.23 42.23L145 37" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M155.827 34.7613L152.957 41.6904M161.145 40.2115L154.312 43.042M161.239 47.8269L154.31 44.9568M155.788 53.1459L152.957 46.3125M151.043 46.3098L148.173 53.2389M149.687 44.958L142.854 47.7885M149.69 43.0434L142.761 40.1732M151.042 41.6875L148.211 34.8541" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-<defs>
-<clipPath id="clip0_1937_21192">
-<rect width="24" height="24" fill="white" transform="translate(140 32)"/>
-</clipPath>
-</defs>
-</svg>

docs/images/established-shapes-base-do.svg

@@ -1,14 +0,0 @@
-<svg width="189" height="88" viewBox="0 0 189 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.7" d="M46 34H38C37.4696 34 36.9609 34.2107 36.5858 34.5858C36.2107 34.9609 36 35.4696 36 36V52C36 52.5304 36.2107 53.0391 36.5858 53.4142C36.9609 53.7893 37.4696 54 38 54H50C50.5304 54 51.0391 53.7893 51.4142 53.4142C51.7893 53.0391 52 52.5304 52 52V40M46 34C46.3166 33.9995 46.6301 34.0616 46.9225 34.1828C47.215 34.3039 47.4806 34.4818 47.704 34.706L51.292 38.294C51.5168 38.5175 51.6952 38.7833 51.8167 39.0762C51.9382 39.369 52.0005 39.683 52 40M46 34V39C46 39.2652 46.1054 39.5196 46.2929 39.7071C46.4804 39.8946 46.7348 40 47 40L52 40" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M56.5 34.5V31.5H53.5M31.5 34.5V31.5L34.5 31.5M34.5 56.5H31.5V53.5M56.5 53.5V56.5H53.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M70.127 43.2749H74.7979V44.7241H70.127V49.395H68.6699V44.7241H64V43.2749H68.6699V38.605H70.127V43.2749Z" fill="black"/>
-<path opacity="0.3" d="M92.2969 47H89.7969C88.736 47 87.7186 47.4214 86.9684 48.1716C86.2183 48.9217 85.7969 49.9391 85.7969 51V53M96.7969 39C96.7969 41.2091 95.006 43 92.7969 43C90.5877 43 88.7969 41.2091 88.7969 39C88.7969 36.7909 90.5877 35 92.7969 35C95.006 35 96.7969 36.7909 96.7969 39Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.7" d="M101.797 48V46C101.797 45.4696 101.586 44.9609 101.211 44.5858C100.836 44.2107 100.327 44 99.7969 44C99.2664 44 98.7577 44.2107 98.3827 44.5858C98.0076 44.9609 97.7969 45.4696 97.7969 46V48M96.6959 48H102.898C103.394 48 103.797 48.4025 103.797 48.899V52.101C103.797 52.5975 103.394 53 102.898 53H96.6959C96.1994 53 95.7969 52.5975 95.7969 52.101V48.899C95.7969 48.4025 96.1994 48 96.6959 48Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M107.5 34.5V31.5H104.5M82.5 34.5V31.5L85.5 31.5M85.5 56.5H82.5V53.5M107.5 53.5V56.5H104.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M124.504 47.145H114.797V45.7388H124.504V47.145ZM124.504 42.2612H114.797V40.855H124.504V42.2612Z" fill="black"/>
-<path d="M136.504 41.8V36C136.504 35.4696 136.715 34.9609 137.09 34.5858C137.465 34.2107 137.973 34 138.504 34H146.504C146.821 33.9992 147.135 34.0612 147.428 34.1824C147.72 34.3036 147.986 34.4815 148.21 34.706L151.798 38.294C152.022 38.5177 152.2 38.7836 152.322 39.0764C152.443 39.3692 152.505 39.6831 152.504 40V52C152.504 52.5304 152.293 53.0391 151.918 53.4142C151.543 53.7893 151.034 54 150.504 54H147.504" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M146.504 34V39C146.504 39.2652 146.609 39.5196 146.797 39.7071C146.984 39.8946 147.239 40 147.504 40H152.504" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M141.504 49V47C141.504 46.4696 141.293 45.9609 140.918 45.5858C140.543 45.2107 140.034 45 139.504 45C138.973 45 138.465 45.2107 138.09 45.5858C137.715 45.9609 137.504 46.4696 137.504 47V49" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M142.504 49H136.504C135.952 49 135.504 49.4477 135.504 50V53C135.504 53.5523 135.952 54 136.504 54H142.504C143.056 54 143.504 53.5523 143.504 53V50C143.504 49.4477 143.056 49 142.504 49Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M157.5 34.5V31.5H154.5M132.5 34.5V31.5L135.5 31.5M135.5 56.5H132.5V53.5M157.5 53.5V56.5H154.5" stroke="#D8D8D9"/>
-</svg>

docs/images/established-shapes-base-dont.svg

@@ -1,14 +0,0 @@
-<svg width="189" height="88" viewBox="0 0 189 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.7" d="M46 34H38C37.4696 34 36.9609 34.2107 36.5858 34.5858C36.2107 34.9609 36 35.4696 36 36V52C36 52.5304 36.2107 53.0391 36.5858 53.4142C36.9609 53.7893 37.4696 54 38 54H50C50.5304 54 51.0391 53.7893 51.4142 53.4142C51.7893 53.0391 52 52.5304 52 52V40M46 34C46.3166 33.9995 46.6301 34.0616 46.9225 34.1828C47.215 34.3039 47.4806 34.4818 47.704 34.706L51.292 38.294C51.5168 38.5175 51.6952 38.7833 51.8167 39.0762C51.9382 39.369 52.0005 39.683 52 40M46 34V39C46 39.2652 46.1054 39.5196 46.2929 39.7071C46.4804 39.8946 46.7348 40 47 40L52 40" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M56.5 34.5V31.5H53.5M31.5 34.5V31.5L34.5 31.5M34.5 56.5H31.5V53.5M56.5 53.5V56.5H53.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M70.127 43.2749H74.7979V44.7241H70.127V49.395H68.6699V44.7241H64V43.2749H68.6699V38.605H70.127V43.2749Z" fill="black"/>
-<path opacity="0.3" d="M92.2969 47H89.7969C88.736 47 87.7186 47.4214 86.9684 48.1716C86.2183 48.9217 85.7969 49.9391 85.7969 51V53M96.7969 39C96.7969 41.2091 95.006 43 92.7969 43C90.5877 43 88.7969 41.2091 88.7969 39C88.7969 36.7909 90.5877 35 92.7969 35C95.006 35 96.7969 36.7909 96.7969 39Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.7" d="M101.797 48V46C101.797 45.4696 101.586 44.9609 101.211 44.5858C100.836 44.2107 100.327 44 99.7969 44C99.2664 44 98.7577 44.2107 98.3827 44.5858C98.0076 44.9609 97.7969 45.4696 97.7969 46V48M96.6959 48H102.898C103.394 48 103.797 48.4025 103.797 48.899V52.101C103.797 52.5975 103.394 53 102.898 53H96.6959C96.1994 53 95.7969 52.5975 95.7969 52.101V48.899C95.7969 48.4025 96.1994 48 96.6959 48Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M107.5 34.5V31.5H104.5M82.5 34.5V31.5L85.5 31.5M85.5 56.5H82.5V53.5M107.5 53.5V56.5H104.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M121.666 40.8555H124.504V42.2617H121.095L119.682 45.7393H124.504V47.1455H119.11L117.84 50.2725H116.374L117.645 47.1455H114.797V45.7393H118.216L119.629 42.2617H114.797V40.8555H120.2L121.471 37.7275H122.937L121.666 40.8555Z" fill="black"/>
-<path d="M150.504 41V36C150.504 35.4696 150.293 34.9609 149.918 34.5858C149.543 34.2107 149.034 34 148.504 34H140.504L134.504 40V52C134.504 52.5304 134.715 53.0391 135.09 53.4142C135.465 53.7893 135.973 54 136.504 54H142.504" stroke="#DD0031" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M141.504 34V41H134.504" stroke="#DD0031" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M148.504 49V47C148.504 46.4696 148.715 45.9609 149.09 45.5858C149.465 45.2107 149.973 45 150.504 45C151.034 45 151.543 45.2107 151.918 45.5858C152.293 45.9609 152.504 46.4696 152.504 47V49" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M147.504 49H153.504C154.056 49 154.504 49.4477 154.504 50V53C154.504 53.5523 154.056 54 153.504 54H147.504C146.952 54 146.504 53.5523 146.504 53V50C146.504 49.4477 146.952 49 147.504 49Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M157.5 34.5V31.5H154.5M132.5 34.5V31.5L135.5 31.5M135.5 56.5H132.5V53.5M157.5 53.5V56.5H154.5" stroke="#D8D8D9"/>
-</svg>

docs/images/established-shapes-consistency-do.svg

@@ -1,14 +0,0 @@
-<svg width="189" height="88" viewBox="0 0 189 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.7" d="M43.35 54H38C37.4696 54 36.9609 53.7893 36.5858 53.4142C36.2107 53.0391 36 52.5304 36 52V36C36 35.4696 36.2107 34.9609 36.5858 34.5858C36.9609 34.2107 37.4696 34 38 34H46M46 34C46.3169 33.9992 46.6308 34.0612 46.9236 34.1824C47.2164 34.3036 47.4823 34.4815 47.706 34.706L51.294 38.294C51.5185 38.5177 51.6964 38.7836 51.8176 39.0764C51.9388 39.3692 52.0008 39.6831 52 40M46 34V39C46 39.2652 46.1054 39.5196 46.2929 39.7071C46.4804 39.8946 46.7348 40 47 40H52M52 40V45.35" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M46 51H52M49 48V54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M56.5 34.5V31.5H53.5M31.5 34.5V31.5L34.5 31.5M34.5 56.5H31.5V53.5M56.5 53.5V56.5H53.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M70.127 43.2749H74.7979V44.7241H70.127V49.395H68.6699V44.7241H64V43.2749H68.6699V38.605H70.127V43.2749Z" fill="black"/>
-<path opacity="0.7" d="M100.797 38L88.7969 50M88.7969 38L100.797 50" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M107.5 34.5V31.5H104.5M82.5 34.5V31.5L85.5 31.5M85.5 56.5H82.5V53.5M107.5 53.5V56.5H104.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M124.504 47.145H114.797V45.7388H124.504V47.145ZM124.504 42.2612H114.797V40.855H124.504V42.2612Z" fill="black"/>
-<path d="M143.504 54H138.504C137.973 54 137.465 53.7893 137.09 53.4142C136.715 53.0391 136.504 52.5304 136.504 52V36C136.504 35.4696 136.715 34.9609 137.09 34.5858C137.465 34.2107 137.973 34 138.504 34H146.504C146.821 33.9992 147.135 34.0612 147.428 34.1824C147.72 34.3036 147.986 34.4815 148.21 34.706L151.798 38.294C152.022 38.5177 152.2 38.7836 152.322 39.0764C152.443 39.3692 152.505 39.6831 152.504 40V45" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M146.504 34V39C146.504 39.2652 146.609 39.5196 146.797 39.7071C146.984 39.8946 147.239 40 147.504 40H152.504" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M147.504 49L152.504 54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M152.504 49L147.504 54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M157.5 34.5V31.5H154.5M132.5 34.5V31.5L135.5 31.5M135.5 56.5H132.5V53.5M157.5 53.5V56.5H154.5" stroke="#D8D8D9"/>
-</svg>

docs/images/established-shapes-consistency-dont.svg

@@ -1,13 +0,0 @@
-<svg width="189" height="88" viewBox="0 0 189 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.7" d="M43.35 54H38C37.4696 54 36.9609 53.7893 36.5858 53.4142C36.2107 53.0391 36 52.5304 36 52V36C36 35.4696 36.2107 34.9609 36.5858 34.5858C36.9609 34.2107 37.4696 34 38 34H46M46 34C46.3169 33.9992 46.6308 34.0612 46.9236 34.1824C47.2164 34.3036 47.4823 34.4815 47.706 34.706L51.294 38.294C51.5185 38.5177 51.6964 38.7836 51.8176 39.0764C51.9388 39.3692 52.0008 39.6831 52 40M46 34V39C46 39.2652 46.1054 39.5196 46.2929 39.7071C46.4804 39.8946 46.7348 40 47 40H52M52 40V45.35" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M46 51H52M49 48V54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M56.5 34.5V31.5H53.5M31.5 34.5V31.5L34.5 31.5M34.5 56.5H31.5V53.5M56.5 53.5V56.5H53.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M70.127 43.2749H74.7979V44.7241H70.127V49.395H68.6699V44.7241H64V43.2749H68.6699V38.605H70.127V43.2749Z" fill="black"/>
-<path opacity="0.7" d="M100.797 38L88.7969 50M88.7969 38L100.797 50" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M107.5 34.5V31.5H104.5M82.5 34.5V31.5L85.5 31.5M85.5 56.5H82.5V53.5M107.5 53.5V56.5H104.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M121.666 40.8555H124.504V42.2617H121.095L119.682 45.7393H124.504V47.1455H119.11L117.84 50.2725H116.374L117.645 47.1455H114.797V45.7393H118.216L119.629 42.2617H114.797V40.8555H120.2L121.471 37.7275H122.937L121.666 40.8555Z" fill="black"/>
-<path d="M148.504 54H150.504C151.034 54 151.543 53.7893 151.918 53.4142C152.293 53.0391 152.504 52.5304 152.504 52V45.35V40C152.505 39.6831 152.443 39.3692 152.322 39.0764C152.2 38.7836 152.022 38.5177 151.798 38.294L148.21 34.706C147.986 34.4815 147.72 34.3036 147.428 34.1824C147.135 34.0612 146.821 33.9992 146.504 34H138.504C137.973 34 137.465 34.2107 137.09 34.5858C136.715 34.9609 136.504 35.4696 136.504 36V42" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M136.504 46.0016L140.502 50M140.502 50L144.501 53.9983M140.502 50L144.501 46.0016M140.502 50L136.504 53.9983" stroke="#DD0031" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M146.504 34V39C146.504 39.2652 146.609 39.5196 146.797 39.7071C146.984 39.8946 147.239 40 147.504 40H152.504" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M157.5 34.5V31.5H154.5M132.5 34.5V31.5L135.5 31.5M135.5 56.5H132.5V53.5M157.5 53.5V56.5H154.5" stroke="#D8D8D9"/>
-</svg>

docs/images/established-shapes-sub-do.svg

@@ -1,11 +0,0 @@
-<svg width="189" height="88" viewBox="0 0 189 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.7" d="M52 52C52.5304 52 53.0391 51.7893 53.4142 51.4142C53.7893 51.0391 54 50.5304 54 50V40C54 39.4696 53.7893 38.9609 53.4142 38.5858C53.0391 38.2107 52.5304 38 52 38H44.1C43.7655 38.0033 43.4355 37.9226 43.1403 37.7654C42.8451 37.6081 42.594 37.3794 42.41 37.1L41.6 35.9C41.4179 35.6235 41.17 35.3965 40.8785 35.2394C40.587 35.0823 40.2611 35.0001 39.93 35H36C35.4696 35 34.9609 35.2107 34.5858 35.5858C34.2107 35.9609 34 36.4696 34 37V50C34 50.5304 34.2107 51.0391 34.5858 51.4142C34.9609 51.7893 35.4696 52 36 52H52Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M56.5 34.5V31.5H53.5M31.5 34.5V31.5L34.5 31.5M34.5 56.5H31.5V53.5M56.5 53.5V56.5H53.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M70.127 43.2749H74.7979V44.7241H70.127V49.395H68.6699V44.7241H64V43.2749H68.6699V38.605H70.127V43.2749Z" fill="black"/>
-<path opacity="0.3" d="M92.2969 47H89.7969C88.736 47 87.7186 47.4214 86.9684 48.1716C86.2183 48.9217 85.7969 49.9391 85.7969 51V53M96.7969 39C96.7969 41.2091 95.006 43 92.7969 43C90.5877 43 88.7969 41.2091 88.7969 39C88.7969 36.7909 90.5877 35 92.7969 35C95.006 35 96.7969 36.7909 96.7969 39Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.7" d="M101.797 48V46C101.797 45.4696 101.586 44.9609 101.211 44.5858C100.836 44.2107 100.327 44 99.7969 44C99.2664 44 98.7577 44.2107 98.3827 44.5858C98.0076 44.9609 97.7969 45.4696 97.7969 46V48M96.6959 48H102.898C103.394 48 103.797 48.4025 103.797 48.899V52.101C103.797 52.5975 103.394 53 102.898 53H96.6959C96.1994 53 95.7969 52.5975 95.7969 52.101V48.899C95.7969 48.4025 96.1994 48 96.6959 48Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M107.5 34.5V31.5H104.5M82.5 34.5V31.5L85.5 31.5M85.5 56.5H82.5V53.5M107.5 53.5V56.5H104.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M124.504 47.145H114.797V45.7388H124.504V47.145ZM124.504 42.2612H114.797V40.855H124.504V42.2612Z" fill="black"/>
-<path d="M143 52H137C136.47 52 135.961 51.7893 135.586 51.4142C135.211 51.0391 135 50.5304 135 50V37C135 36.4695 135.211 35.9608 135.586 35.5858C135.961 35.2107 136.47 35 137 35H140.9C141.234 34.9967 141.564 35.0774 141.86 35.2346C142.155 35.3918 142.406 35.6206 142.59 35.9L143.4 37.1C143.582 37.3765 143.83 37.6035 144.122 37.7606C144.413 37.9177 144.739 37.9999 145.07 38H153C153.53 38 154.039 38.2107 154.414 38.5858C154.789 38.9608 155 39.4695 155 40V42.5M153 49V47C153 46.4695 152.789 45.9608 152.414 45.5858C152.039 45.2107 151.53 45 151 45C150.47 45 149.961 45.2107 149.586 45.5858C149.211 45.9608 149 46.4695 149 47V49M148 49H154C154.552 49 155 49.4477 155 50V53C155 53.5523 154.552 54 154 54H148C147.448 54 147 53.5523 147 53V50C147 49.4477 147.448 49 148 49Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M157.5 34.5V31.5H154.5M132.5 34.5V31.5L135.5 31.5M135.5 56.5H132.5V53.5M157.5 53.5V56.5H154.5" stroke="#D8D8D9"/>
-</svg>

docs/images/established-shapes-sub-dont.svg

@@ -1,12 +0,0 @@
-<svg width="189" height="88" viewBox="0 0 189 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.7" d="M52 52C52.5304 52 53.0391 51.7893 53.4142 51.4142C53.7893 51.0391 54 50.5304 54 50V40C54 39.4696 53.7893 38.9609 53.4142 38.5858C53.0391 38.2107 52.5304 38 52 38H44.1C43.7655 38.0033 43.4355 37.9226 43.1403 37.7654C42.8451 37.6081 42.594 37.3794 42.41 37.1L41.6 35.9C41.4179 35.6235 41.17 35.3965 40.8785 35.2394C40.587 35.0823 40.2611 35.0001 39.93 35H36C35.4696 35 34.9609 35.2107 34.5858 35.5858C34.2107 35.9609 34 36.4696 34 37V50C34 50.5304 34.2107 51.0391 34.5858 51.4142C34.9609 51.7893 35.4696 52 36 52H52Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M56.5 34.5V31.5H53.5M31.5 34.5V31.5L34.5 31.5M34.5 56.5H31.5V53.5M56.5 53.5V56.5H53.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M70.127 43.2749H74.7979V44.7241H70.127V49.395H68.6699V44.7241H64V43.2749H68.6699V38.605H70.127V43.2749Z" fill="black"/>
-<path opacity="0.3" d="M92.2969 47H89.7969C88.736 47 87.7186 47.4214 86.9684 48.1716C86.2183 48.9217 85.7969 49.9391 85.7969 51V53M96.7969 39C96.7969 41.2091 95.006 43 92.7969 43C90.5877 43 88.7969 41.2091 88.7969 39C88.7969 36.7909 90.5877 35 92.7969 35C95.006 35 96.7969 36.7909 96.7969 39Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.7" d="M101.797 48V46C101.797 45.4696 101.586 44.9609 101.211 44.5858C100.836 44.2107 100.327 44 99.7969 44C99.2664 44 98.7577 44.2107 98.3827 44.5858C98.0076 44.9609 97.7969 45.4696 97.7969 46V48M96.6959 48H102.898C103.394 48 103.797 48.4025 103.797 48.899V52.101C103.797 52.5975 103.394 53 102.898 53H96.6959C96.1994 53 95.7969 52.5975 95.7969 52.101V48.899C95.7969 48.4025 96.1994 48 96.6959 48Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M107.5 34.5V31.5H104.5M82.5 34.5V31.5L85.5 31.5M85.5 56.5H82.5V53.5M107.5 53.5V56.5H104.5" stroke="#D8D8D9"/>
-<path opacity="0.3" d="M121.666 40.8555H124.504V42.2617H121.095L119.682 45.7393H124.504V47.1455H119.11L117.84 50.2725H116.374L117.645 47.1455H114.797V45.7393H118.216L119.629 42.2617H114.797V40.8555H120.2L121.471 37.7275H122.937L121.666 40.8555Z" fill="black"/>
-<path d="M152.504 47V45C152.504 43.3431 151.161 42 149.504 42C147.847 42 146.504 43.3431 146.504 45V47M152.504 47H146.504M152.504 47C153.608 47 154.504 47.8954 154.504 49V53C154.504 54.1046 153.608 55 152.504 55H146.504C145.399 55 144.504 54.1046 144.504 53V49C144.504 47.8954 145.399 47 146.504 47M149.504 51V51.01" stroke="#DD0031" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.9" d="M157.5 34.5V31.5H154.5M132.5 34.5V31.5L135.5 31.5M135.5 56.5H132.5V53.5M157.5 53.5V56.5H154.5" stroke="#D8D8D9"/>
-<path d="M140 52H137C136.47 52 135.961 51.7893 135.586 51.4142C135.211 51.0391 135 50.5304 135 50V37C135 36.4695 135.211 35.9608 135.586 35.5858C135.961 35.2107 136.47 35 137 35H140.9C141.234 34.9967 141.564 35.0774 141.86 35.2346C142.155 35.3918 142.406 35.6206 142.59 35.9L143.4 37.1C143.582 37.3765 143.83 37.6035 144.122 37.7606C144.413 37.9177 144.739 37.9999 145.07 38H153C153.53 38 154.039 38.2107 154.414 38.5858C154.789 38.9608 155 39.4695 155 40V40.5" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

docs/images/pixel-perfection-diagonals-do.svg

@@ -1,227 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g opacity="0.1">
-<path d="M60 220V230H50V220H60Z" fill="black"/>
-<path d="M100 210H90V200H100V210Z" fill="black"/>
-<path d="M70 200H60V190H70V200Z" fill="black"/>
-<path d="M110 200H100V190H110V200Z" fill="black"/>
-<path d="M20 190H10V180H20V190Z" fill="black"/>
-<path d="M80 190H70V180H80V190Z" fill="black"/>
-<path d="M120 190H110V180H120V190Z" fill="black"/>
-<path d="M50 180H40V170H50V180Z" fill="black"/>
-<path d="M90 180H80V170H90V180Z" fill="black"/>
-<path d="M130 180H120V170H130V180Z" fill="black"/>
-<path d="M60 170H50V160H60V170Z" fill="black"/>
-<path d="M100 170H90V160H100V170Z" fill="black"/>
-<path d="M140 170H130V160H140V170Z" fill="black"/>
-<path d="M30 160H20V150H30V160Z" fill="black"/>
-<path d="M70 160H60V150H70V160Z" fill="black"/>
-<path d="M110 160H100V150H110V160Z" fill="black"/>
-<path d="M150 160H140V150H150V160Z" fill="black"/>
-<path d="M40 150H30V140H40V150Z" fill="black"/>
-<path d="M80 150H70V140H80V150Z" fill="black"/>
-<path d="M120 150H110V140H120V150Z" fill="black"/>
-<path d="M160 150H150V140H160V150Z" fill="black"/>
-<path d="M50 140H40V130H50V140Z" fill="black"/>
-<path d="M90 140H80V130H90V140Z" fill="black"/>
-<path d="M130 140H120V130H130V140Z" fill="black"/>
-<path d="M170 140H160V130H170V140Z" fill="black"/>
-<path d="M60 130H50V120H60V130Z" fill="black"/>
-<path d="M100 130H90V120H100V130Z" fill="black"/>
-<path d="M140 130H130V120H140V130Z" fill="black"/>
-<path d="M180 130H170V120H180V130Z" fill="black"/>
-<path d="M70 120H60V110H70V120Z" fill="black"/>
-<path d="M110 120H100V110H110V120Z" fill="black"/>
-<path d="M150 120H140V110H150V120Z" fill="black"/>
-<path d="M190 120H180V110H190V120Z" fill="black"/>
-<path d="M80 110H70V100H80V110Z" fill="black"/>
-<path d="M120 110H110V100H120V110Z" fill="black"/>
-<path d="M160 110H150V100H160V110Z" fill="black"/>
-<path d="M200 110H190V100H200V110Z" fill="black"/>
-<path d="M90 100H80V90H90V100Z" fill="black"/>
-<path d="M130 100H120V90H130V100Z" fill="black"/>
-<path d="M170 100H160V90H170V100Z" fill="black"/>
-<path d="M210 100H200V90H210V100Z" fill="black"/>
-<path d="M100 90H90V80H100V90Z" fill="black"/>
-<path d="M140 90H130V80H140V90Z" fill="black"/>
-<path d="M180 90H170V80H180V90Z" fill="black"/>
-<path d="M220 90H210V80H220V90Z" fill="black"/>
-<path d="M110 80H100V70H110V80Z" fill="black"/>
-<path d="M150 80H140V70H150V80Z" fill="black"/>
-<path d="M190 80H180V70H190V80Z" fill="black"/>
-<path d="M230 80H220V70H230V80Z" fill="black"/>
-<path d="M120 70H110V60H120V70Z" fill="black"/>
-<path d="M160 70H150V60H160V70Z" fill="black"/>
-<path d="M200 70H190V60H200V70Z" fill="black"/>
-<path d="M130 60H120V50H130V60Z" fill="black"/>
-<path d="M170 60H160V50H170V60Z" fill="black"/>
-<path d="M210 60H200V50H210V60Z" fill="black"/>
-<path d="M140 50H130V40H140V50Z" fill="black"/>
-<path d="M180 50H170V40H180V50Z" fill="black"/>
-<path d="M150 40H140V30H150V40Z" fill="black"/>
-<path d="M190 40H180V30H190V40Z" fill="black"/>
-<path d="M160 30H150V20H160V30Z" fill="black"/>
-<path d="M230 30H220V20H230V30Z" fill="black"/>
-<path d="M220 20H210V10H220V20Z" fill="black"/>
-</g>
-<g opacity="0.5">
-<path d="M20 230H10V220H20V230Z" fill="black"/>
-<path d="M50 220V230H40V220H50Z" fill="black"/>
-<path d="M80 220H70V210H80V220Z" fill="black"/>
-<path d="M40 200H50V210H30V190H40V200Z" fill="black"/>
-<path d="M20 200H10V190H20V200Z" fill="black"/>
-<path d="M30 170H20V160H30V170Z" fill="black"/>
-<path d="M230 70H220V60H230V70Z" fill="black"/>
-<path d="M210 40H200V30H210V40Z" fill="black"/>
-<path d="M180 20H170V10H180V20Z" fill="black"/>
-</g>
-<g opacity="0.8">
-<path d="M40 220V230H30V220H40Z" fill="black"/>
-<path d="M70 220H60V210H70V220Z" fill="black"/>
-<path d="M20 210H10V200H20V210Z" fill="black"/>
-<path d="M90 210H80V200H90V210Z" fill="black"/>
-<path d="M80 200H70V190H80V200Z" fill="black"/>
-<path d="M100 200H90V190H100V200Z" fill="black"/>
-<path d="M40 190H30V180H40V190Z" fill="black"/>
-<path d="M90 190H80V180H90V190Z" fill="black"/>
-<path d="M110 190H100V180H110V190Z" fill="black"/>
-<path d="M30 180H20V170H30V180Z" fill="black"/>
-<path d="M100 180H90V170H100V180Z" fill="black"/>
-<path d="M120 180H110V170H120V180Z" fill="black"/>
-<path d="M50 170H40V160H50V170Z" fill="black"/>
-<path d="M110 170H100V160H110V170Z" fill="black"/>
-<path d="M130 170H120V160H130V170Z" fill="black"/>
-<path d="M40 160H30V150H40V160Z" fill="black"/>
-<path d="M60 160H50V150H60V160Z" fill="black"/>
-<path d="M120 160H110V150H120V160Z" fill="black"/>
-<path d="M140 160H130V150H140V160Z" fill="black"/>
-<path d="M50 150H40V140H50V150Z" fill="black"/>
-<path d="M70 150H60V140H70V150Z" fill="black"/>
-<path d="M130 150H120V140H130V150Z" fill="black"/>
-<path d="M150 150H140V140H150V150Z" fill="black"/>
-<path d="M60 140H50V130H60V140Z" fill="black"/>
-<path d="M80 140H70V130H80V140Z" fill="black"/>
-<path d="M140 140H130V130H140V140Z" fill="black"/>
-<path d="M160 140H150V130H160V140Z" fill="black"/>
-<path d="M70 130H60V120H70V130Z" fill="black"/>
-<path d="M90 130H80V120H90V130Z" fill="black"/>
-<path d="M150 130H140V120H150V130Z" fill="black"/>
-<path d="M170 130H160V120H170V130Z" fill="black"/>
-<path d="M80 120H70V110H80V120Z" fill="black"/>
-<path d="M100 120H90V110H100V120Z" fill="black"/>
-<path d="M160 120H150V110H160V120Z" fill="black"/>
-<path d="M180 120H170V110H180V120Z" fill="black"/>
-<path d="M90 110H80V100H90V110Z" fill="black"/>
-<path d="M110 110H100V100H110V110Z" fill="black"/>
-<path d="M170 110H160V100H170V110Z" fill="black"/>
-<path d="M190 110H180V100H190V110Z" fill="black"/>
-<path d="M100 100H90V90H100V100Z" fill="black"/>
-<path d="M120 100H110V90H120V100Z" fill="black"/>
-<path d="M180 100H170V90H180V100Z" fill="black"/>
-<path d="M200 100H190V90H200V100Z" fill="black"/>
-<path d="M110 90H100V80H110V90Z" fill="black"/>
-<path d="M130 90H120V80H130V90Z" fill="black"/>
-<path d="M190 90H180V80H190V90Z" fill="black"/>
-<path d="M210 90H200V80H210V90Z" fill="black"/>
-<path d="M120 80H110V70H120V80Z" fill="black"/>
-<path d="M140 80H130V70H140V80Z" fill="black"/>
-<path d="M200 80H190V70H200V80Z" fill="black"/>
-<path d="M220 80H210V70H220V80Z" fill="black"/>
-<path d="M130 70H120V60H130V70Z" fill="black"/>
-<path d="M150 70H140V60H150V70Z" fill="black"/>
-<path d="M210 70H200V60H210V70Z" fill="black"/>
-<path d="M140 60H130V50H140V60Z" fill="black"/>
-<path d="M160 60H150V50H160V60Z" fill="black"/>
-<path d="M150 50H140V40H150V50Z" fill="black"/>
-<path d="M170 50H160V40H170V50Z" fill="black"/>
-<path d="M160 40H150V30H160V40Z" fill="black"/>
-<path d="M180 40H170V30H180V40Z" fill="black"/>
-<path d="M230 40H220V30H230V40Z" fill="black"/>
-<path d="M170 30H160V20H170V30Z" fill="black"/>
-<path d="M210 20H200V10H210V20Z" fill="black"/>
-</g>
-<path d="M20 220H10V210H20V180H30V210H50V200H80V210H60V220H30V230H20V220Z" fill="black"/>
-<path d="M90 200H80V190H90V200Z" fill="black"/>
-<path d="M100 190H90V180H100V190Z" fill="black"/>
-<path d="M40 180H30V160H40V180Z" fill="black"/>
-<path d="M110 180H100V170H110V180Z" fill="black"/>
-<path d="M120 170H110V160H120V170Z" fill="black"/>
-<path d="M50 160H40V150H50V160Z" fill="black"/>
-<path d="M130 160H120V150H130V160Z" fill="black"/>
-<path d="M60 150H50V140H60V150Z" fill="black"/>
-<path d="M140 150H130V140H140V150Z" fill="black"/>
-<path d="M70 140H60V130H70V140Z" fill="black"/>
-<path d="M150 140H140V130H150V140Z" fill="black"/>
-<path d="M80 130H70V120H80V130Z" fill="black"/>
-<path d="M160 130H150V120H160V130Z" fill="black"/>
-<path d="M90 120H80V110H90V120Z" fill="black"/>
-<path d="M170 120H160V110H170V120Z" fill="black"/>
-<path d="M100 110H90V100H100V110Z" fill="black"/>
-<path d="M180 110H170V100H180V110Z" fill="black"/>
-<path d="M110 100H100V90H110V100Z" fill="black"/>
-<path d="M190 100H180V90H190V100Z" fill="black"/>
-<path d="M120 90H110V80H120V90Z" fill="black"/>
-<path d="M200 90H190V80H200V90Z" fill="black"/>
-<path d="M130 80H120V70H130V80Z" fill="black"/>
-<path d="M210 80H200V70H210V80Z" fill="black"/>
-<path d="M140 70H130V60H140V70Z" fill="black"/>
-<path d="M200 20H220V40H230V60H220V70H210V30H170V20H180V10H200V20Z" fill="black"/>
-<path d="M150 60H140V50H150V60Z" fill="black"/>
-<path d="M160 50H150V40H160V50Z" fill="black"/>
-<path d="M170 40H160V30H170V40Z" fill="black"/>
-<g clip-path="url(#clip0_1962_4405)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path opacity="0.5" d="M211.739 68.1199C217.026 62.8341 219.997 55.6646 219.998 48.1884C219.999 40.7123 217.03 33.542 211.744 28.2549C206.459 22.9678 199.289 19.997 191.813 19.9961C184.337 19.9952 177.166 22.9641 171.879 28.2499L38.4193 161.74C36.0975 164.055 34.3805 166.905 33.4193 170.04L20.2093 213.56C19.9509 214.425 19.9314 215.343 20.1529 216.218C20.3743 217.093 20.8285 217.892 21.4673 218.53C22.1061 219.168 22.9055 219.621 23.7809 219.841C24.6563 220.061 25.5749 220.04 26.4393 219.78L69.9693 206.58C73.101 205.627 75.9511 203.921 78.2693 201.61L211.739 68.1199Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M191.814 9.99609C201.942 9.99745 211.655 14.022 218.816 21.1846C225.977 28.3472 229.999 38.0612 229.998 48.1895C229.997 58.3172 225.971 68.0287 218.809 75.1895L218.81 75.1904L85.3406 208.681C85.3368 208.685 85.3328 208.689 85.3289 208.692C81.8516 212.159 77.5762 214.719 72.8787 216.147L72.8709 216.149L29.3406 229.35C29.3331 229.352 29.3256 229.354 29.3182 229.356C26.7249 230.136 23.9687 230.199 21.3426 229.539C18.7165 228.879 16.3184 227.52 14.4021 225.606C12.4858 223.693 11.1232 221.297 10.4588 218.672C9.79438 216.047 9.85239 213.291 10.6277 210.696L10.6404 210.655L23.8504 167.136L23.8582 167.108C25.2999 162.406 27.8755 158.131 31.3582 154.658L164.809 21.1777C171.972 14.017 181.686 9.99482 191.814 9.99609ZM191.811 29.9961C186.987 29.9955 182.36 31.9117 178.949 35.3223L45.491 168.811C45.4874 168.814 45.4838 168.818 45.4803 168.821C44.3194 169.979 43.4608 171.404 42.9803 172.972L32.5017 207.491L67.0672 197.01C68.6245 196.535 70.042 195.687 71.1971 194.539L204.668 61.0498L204.669 61.0479C208.08 57.6373 209.997 53.0114 209.998 48.1875C209.998 43.3637 208.083 38.7367 204.673 35.3252C201.262 31.9137 196.635 29.9967 191.811 29.9961Z" stroke="#41B883" stroke-dasharray="1 1"/>
-<path d="M211.739 68.1199C217.026 62.8341 219.997 55.6646 219.998 48.1884C219.999 40.7123 217.03 33.542 211.744 28.2549C206.459 22.9678 199.289 19.997 191.813 19.9961C184.337 19.9952 177.166 22.9641 171.879 28.2499L38.4193 161.74C36.0975 164.055 34.3805 166.905 33.4193 170.04L20.2093 213.56C19.9509 214.425 19.9314 215.343 20.1529 216.218C20.3743 217.093 20.8285 217.892 21.4673 218.53C22.1061 219.168 22.9055 219.621 23.7809 219.841C24.6563 220.061 25.5749 220.04 26.4393 219.78L69.9693 206.58C73.101 205.627 75.9511 203.921 78.2693 201.61L211.739 68.1199Z" stroke="#41B883" stroke-linecap="round" stroke-linejoin="round"/>
-<defs>
-<clipPath id="clip0_1962_4405">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/pixel-perfection-diagonals-dont.svg

@@ -1,234 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path opacity="0.5" d="M180 10H170V20H180V10Z" fill="black"/>
-<path opacity="0.75" d="M190 10H180V20H190V10Z" fill="black"/>
-<path d="M200 10H190V20H200V10Z" fill="black"/>
-<path opacity="0.75" d="M210 10H200V20H210V10Z" fill="black"/>
-<path opacity="0.25" d="M220 10H210V20H220V10Z" fill="black"/>
-<path opacity="0.5" d="M170 20H160V30H170V20Z" fill="black"/>
-<path d="M180 20H170V30H180V20Z" fill="black"/>
-<path d="M190 20H180V30H190V20Z" fill="black"/>
-<path d="M200 20H190V30H200V20Z" fill="black"/>
-<path d="M210 20H200V30H210V20Z" fill="black"/>
-<path d="M220 20H210V30H220V20Z" fill="black"/>
-<path opacity="0.5" d="M230 20H220V30H230V20Z" fill="black"/>
-<path opacity="0.5" d="M160 30H150V40H160V30Z" fill="black"/>
-<path d="M170 30H160V40H170V30Z" fill="black"/>
-<path d="M180 30H170V40H180V30Z" fill="black"/>
-<path opacity="0.5" d="M190 30H180V40H190V30Z" fill="black"/>
-<path opacity="0.5" d="M210 30H200V40H210V30Z" fill="black"/>
-<path d="M220 30H210V40H220V30Z" fill="black"/>
-<path opacity="0.75" d="M230 30H220V40H230V30Z" fill="black"/>
-<path opacity="0.5" d="M150 40H140V50H150V40Z" fill="black"/>
-<path d="M160 40H150V50H160V40Z" fill="black"/>
-<path d="M170 40H160V50H170V40Z" fill="black"/>
-<path opacity="0.5" d="M180 40H170V50H180V40Z" fill="black"/>
-<path d="M220 40H210V50H220V40Z" fill="black"/>
-<path d="M230 40H220V50H230V40Z" fill="black"/>
-<path opacity="0.5" d="M140 50H130V60H140V50Z" fill="black"/>
-<path d="M150 50H140V60H150V50Z" fill="black"/>
-<path d="M160 50H150V60H160V50Z" fill="black"/>
-<path opacity="0.5" d="M170 50H160V60H170V50Z" fill="black"/>
-<path opacity="0.5" d="M210 50H200V60H210V50Z" fill="black"/>
-<path d="M220 50H210V60H220V50Z" fill="black"/>
-<path opacity="0.75" d="M230 50H220V60H230V50Z" fill="black"/>
-<path opacity="0.5" d="M130 60H120V70H130V60Z" fill="black"/>
-<path d="M140 60H130V70H140V60Z" fill="black"/>
-<path d="M150 60H140V70H150V60Z" fill="black"/>
-<path opacity="0.5" d="M160 60H150V70H160V60Z" fill="black"/>
-<path opacity="0.5" d="M200 60H190V70H200V60Z" fill="black"/>
-<path d="M210 60H200V70H210V60Z" fill="black"/>
-<path d="M220 60H210V70H220V60Z" fill="black"/>
-<path opacity="0.5" d="M230 60H220V70H230V60Z" fill="black"/>
-<path opacity="0.5" d="M120 70H110V80H120V70Z" fill="black"/>
-<path d="M130 70H120V80H130V70Z" fill="black"/>
-<path d="M140 70H130V80H140V70Z" fill="black"/>
-<path opacity="0.5" d="M150 70H140V80H150V70Z" fill="black"/>
-<path opacity="0.5" d="M190 70H180V80H190V70Z" fill="black"/>
-<path d="M200 70H190V80H200V70Z" fill="black"/>
-<path d="M210 70H200V80H210V70Z" fill="black"/>
-<path opacity="0.5" d="M220 70H210V80H220V70Z" fill="black"/>
-<path opacity="0.5" d="M110 80H100V90H110V80Z" fill="black"/>
-<path d="M120 80H110V90H120V80Z" fill="black"/>
-<path d="M130 80H120V90H130V80Z" fill="black"/>
-<path opacity="0.5" d="M140 80H130V90H140V80Z" fill="black"/>
-<path opacity="0.5" d="M180 80H170V90H180V80Z" fill="black"/>
-<path d="M190 80H180V90H190V80Z" fill="black"/>
-<path d="M200 80H190V90H200V80Z" fill="black"/>
-<path opacity="0.5" d="M210 80H200V90H210V80Z" fill="black"/>
-<path opacity="0.5" d="M100 90H90V100H100V90Z" fill="black"/>
-<path d="M110 90H100V100H110V90Z" fill="black"/>
-<path d="M120 90H110V100H120V90Z" fill="black"/>
-<path opacity="0.5" d="M130 90H120V100H130V90Z" fill="black"/>
-<path opacity="0.5" d="M170 90H160V100H170V90Z" fill="black"/>
-<path d="M180 90H170V100H180V90Z" fill="black"/>
-<path d="M190 90H180V100H190V90Z" fill="black"/>
-<path opacity="0.5" d="M200 90H190V100H200V90Z" fill="black"/>
-<path opacity="0.5" d="M90 100H80V110H90V100Z" fill="black"/>
-<path d="M100 100H90V110H100V100Z" fill="black"/>
-<path d="M110 100H100V110H110V100Z" fill="black"/>
-<path opacity="0.5" d="M120 100H110V110H120V100Z" fill="black"/>
-<path opacity="0.5" d="M160 100H150V110H160V100Z" fill="black"/>
-<path d="M170 100H160V110H170V100Z" fill="black"/>
-<path d="M180 100H170V110H180V100Z" fill="black"/>
-<path opacity="0.5" d="M190 100H180V110H190V100Z" fill="black"/>
-<path opacity="0.5" d="M80 110H70V120H80V110Z" fill="black"/>
-<path d="M90 110H80V120H90V110Z" fill="black"/>
-<path d="M100 110H90V120H100V110Z" fill="black"/>
-<path opacity="0.5" d="M110 110H100V120H110V110Z" fill="black"/>
-<path opacity="0.5" d="M150 110H140V120H150V110Z" fill="black"/>
-<path d="M160 110H150V120H160V110Z" fill="black"/>
-<path d="M170 110H160V120H170V110Z" fill="black"/>
-<path opacity="0.5" d="M180 110H170V120H180V110Z" fill="black"/>
-<path opacity="0.5" d="M70 120H60V130H70V120Z" fill="black"/>
-<path d="M80 120H70V130H80V120Z" fill="black"/>
-<path d="M90 120H80V130H90V120Z" fill="black"/>
-<path opacity="0.5" d="M100 120H90V130H100V120Z" fill="black"/>
-<path opacity="0.5" d="M140 120H130V130H140V120Z" fill="black"/>
-<path d="M150 120H140V130H150V120Z" fill="black"/>
-<path d="M160 120H150V130H160V120Z" fill="black"/>
-<path opacity="0.5" d="M170 120H160V130H170V120Z" fill="black"/>
-<path opacity="0.5" d="M60 130H50V140H60V130Z" fill="black"/>
-<path d="M70 130H60V140H70V130Z" fill="black"/>
-<path d="M80 130H70V140H80V130Z" fill="black"/>
-<path opacity="0.5" d="M90 130H80V140H90V130Z" fill="black"/>
-<path opacity="0.5" d="M130 130H120V140H130V130Z" fill="black"/>
-<path d="M140 130H130V140H140V130Z" fill="black"/>
-<path d="M150 130H140V140H150V130Z" fill="black"/>
-<path opacity="0.5" d="M160 130H150V140H160V130Z" fill="black"/>
-<path opacity="0.5" d="M50 140H40V150H50V140Z" fill="black"/>
-<path d="M60 140H50V150H60V140Z" fill="black"/>
-<path d="M70 140H60V150H70V140Z" fill="black"/>
-<path opacity="0.5" d="M80 140H70V150H80V140Z" fill="black"/>
-<path opacity="0.5" d="M120 140H110V150H120V140Z" fill="black"/>
-<path d="M130 140H120V150H130V140Z" fill="black"/>
-<path d="M140 140H130V150H140V140Z" fill="black"/>
-<path opacity="0.5" d="M150 140H140V150H150V140Z" fill="black"/>
-<path opacity="0.5" d="M40 150H30V160H40V150Z" fill="black"/>
-<path d="M50 150H40V160H50V150Z" fill="black"/>
-<path d="M60 150H50V160H60V150Z" fill="black"/>
-<path opacity="0.5" d="M70 150H60V160H70V150Z" fill="black"/>
-<path opacity="0.5" d="M110 150H100V160H110V150Z" fill="black"/>
-<path d="M120 150H110V160H120V150Z" fill="black"/>
-<path d="M130 150H120V160H130V150Z" fill="black"/>
-<path opacity="0.5" d="M140 150H130V160H140V150Z" fill="black"/>
-<path opacity="0.5" d="M30 160H20V170H30V160Z" fill="black"/>
-<path d="M40 160H30V170H40V160Z" fill="black"/>
-<path d="M50 160H40V170H50V160Z" fill="black"/>
-<path opacity="0.5" d="M60 160H50V170H60V160Z" fill="black"/>
-<path opacity="0.5" d="M100 160H90V170H100V160Z" fill="black"/>
-<path d="M110 160H100V170H110V160Z" fill="black"/>
-<path d="M120 160H110V170H120V160Z" fill="black"/>
-<path opacity="0.5" d="M130 160H120V170H130V160Z" fill="black"/>
-<path opacity="0.75" d="M30 170H20V180H30V170Z" fill="black"/>
-<path d="M40 170H30V180H40V170Z" fill="black"/>
-<path opacity="0.5" d="M50 170H40V180H50V170Z" fill="black"/>
-<path opacity="0.5" d="M90 170H80V180H90V170Z" fill="black"/>
-<path d="M100 170H90V180H100V170Z" fill="black"/>
-<path d="M110 170H100V180H110V170Z" fill="black"/>
-<path opacity="0.5" d="M120 170H110V180H120V170Z" fill="black"/>
-<path opacity="0.25" d="M20 180H10V190H20V180Z" fill="black"/>
-<path d="M30 180H20V190H30V180Z" fill="black"/>
-<path d="M40 180H30V190H40V180Z" fill="black"/>
-<path opacity="0.5" d="M80 180H70V190H80V180Z" fill="black"/>
-<path d="M90 180H80V190H90V180Z" fill="black"/>
-<path d="M100 180H90V190H100V180Z" fill="black"/>
-<path opacity="0.5" d="M110 180H100V190H110V180Z" fill="black"/>
-<path opacity="0.5" d="M20 190H10V200H20V190Z" fill="black"/>
-<path d="M30 190H20V200H30V190Z" fill="black"/>
-<path opacity="0.75" d="M40 190H30V200H40V190Z" fill="black"/>
-<path opacity="0.5" d="M70 190H60V200H70V190Z" fill="black"/>
-<path d="M80 190H70V200H80V190Z" fill="black"/>
-<path d="M90 190H80V200H90V190Z" fill="black"/>
-<path opacity="0.5" d="M100 190H90V200H100V190Z" fill="black"/>
-<path opacity="0.75" d="M20 200H10V210H20V200Z" fill="black"/>
-<path d="M30 200H20V210H30V200Z" fill="black"/>
-<path opacity="0.75" d="M40 200H30V210H40V200Z" fill="black"/>
-<path opacity="0.75" d="M50 200H40V210H50V200Z" fill="black"/>
-<path d="M60 200H50V210H60V200Z" fill="black"/>
-<path d="M70 200H60V210H70V200Z" fill="black"/>
-<path d="M80 200H70V210H80V200Z" fill="black"/>
-<path opacity="0.5" d="M90 200H80V210H90V200Z" fill="black"/>
-<path d="M20 210H10V220H20V210Z" fill="black"/>
-<path d="M30 210H20V220H30V210Z" fill="black"/>
-<path d="M40 210H30V220H40V210Z" fill="black"/>
-<path d="M50 210H40V220H50V210Z" fill="black"/>
-<path d="M60 210H50V220H60V210Z" fill="black"/>
-<path opacity="0.75" d="M70 210H60V220H70V210Z" fill="black"/>
-<path opacity="0.5" d="M80 210H70V220H80V210Z" fill="black"/>
-<path opacity="0.5" d="M20 220H10V230H20V220Z" fill="black"/>
-<path d="M30 220H20V230H30V220Z" fill="black"/>
-<path opacity="0.75" d="M40 220H30V230H40V220Z" fill="black"/>
-<path opacity="0.5" d="M50 220H40V230H50V220Z" fill="black"/>
-<g clip-path="url(#clip0_1962_4638)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path opacity="0.5" d="M212.297 63.036C217.122 58.2123 219.887 51.724 219.985 44.9983C220.083 38.2726 217.505 31.8605 212.818 27.1726C208.131 22.4847 201.72 19.9049 194.994 20.0009C188.269 20.0969 181.78 22.8607 176.955 27.6843L37.1393 167.542C35.0206 169.655 33.439 172.241 32.5337 175.074L20.0862 214.396C19.8425 215.178 19.8131 216.004 20.001 216.789C20.1889 217.573 20.5872 218.286 21.1535 218.851C21.7199 219.416 22.4333 219.814 23.2179 220C24.0026 220.187 24.8293 220.156 25.6103 219.911L64.9412 207.472C67.7708 206.575 70.3569 205.003 72.4723 202.894L212.297 63.036Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M194.851 10.0021C204.234 9.8682 213.261 13.4725 219.889 20.1027C226.518 26.733 230.12 35.7611 229.984 45.1437C229.848 54.5118 226.003 63.4717 219.368 70.1057L79.5437 209.964C79.5399 209.968 79.5358 209.972 79.532 209.976C76.2933 213.204 72.3258 215.621 67.9646 217.004L67.9568 217.007L28.6257 229.445C28.6182 229.448 28.6099 229.45 28.6023 229.452C26.1285 230.228 23.469 230.339 20.9041 229.729C18.3358 229.118 15.9729 227.81 14.0877 225.928C12.2025 224.046 10.8912 221.686 10.2761 219.118C9.66182 216.554 9.76789 213.894 10.5398 211.419L10.5525 211.378L22.9998 172.056L23.0086 172.029C24.4038 167.664 26.8342 163.696 30.0779 160.461L169.885 20.6125C176.52 13.9783 185.482 10.1359 194.851 10.0021ZM195.136 30.0002C191.054 30.0586 187.039 31.7431 184.025 34.756L44.2107 174.612C44.207 174.615 44.2037 174.62 44.2 174.623C43.2065 175.614 42.4736 176.818 42.0584 178.117L32.8767 207.124L61.9256 197.938C63.2203 197.526 64.4218 196.799 65.4119 195.812L205.225 55.966L205.226 55.9641C208.24 52.9509 209.927 48.9352 209.986 44.8527C210.045 40.7841 208.491 36.9878 205.746 34.2424C203.001 31.4969 199.205 29.9421 195.136 30.0002Z" stroke="url(#paint0_linear_1962_4638)" stroke-dasharray="1 1"/>
-<path d="M212.297 63.036C217.122 58.2123 219.887 51.724 219.985 44.9983C220.083 38.2726 217.505 31.8605 212.818 27.1726C208.131 22.4847 201.72 19.9049 194.994 20.0009C188.269 20.0969 181.78 22.8607 176.955 27.6843L37.1393 167.542C35.0206 169.655 33.439 172.241 32.5337 175.074L20.0862 214.396C19.8425 215.178 19.8131 216.004 20.001 216.789C20.1889 217.573 20.5872 218.286 21.1535 218.851C21.7199 219.416 22.4333 219.814 23.2179 220C24.0026 220.187 24.8293 220.156 25.6103 219.911L64.9412 207.472C67.7708 206.575 70.3569 205.003 72.4723 202.894L212.297 63.036Z" stroke="url(#paint1_linear_1962_4638)"/>
-<defs>
-<linearGradient id="paint0_linear_1962_4638" x1="220.102" y1="13.8502" x2="10.0141" y2="229.99" gradientUnits="userSpaceOnUse">
-<stop stop-color="#41B883"/>
-<stop offset="0.108741" stop-color="#FFB13B"/>
-<stop offset="0.180356" stop-color="#DD0031"/>
-<stop offset="0.765123" stop-color="#DD0031"/>
-<stop offset="0.83336" stop-color="#FFB13B"/>
-<stop offset="1" stop-color="#41B883"/>
-</linearGradient>
-<linearGradient id="paint1_linear_1962_4638" x1="211" y1="23.5" x2="20" y2="220" gradientUnits="userSpaceOnUse">
-<stop stop-color="#41B883"/>
-<stop offset="0.108741" stop-color="#FFB13B"/>
-<stop offset="0.180356" stop-color="#DD0031"/>
-<stop offset="0.765123" stop-color="#DD0031"/>
-<stop offset="0.83336" stop-color="#FFB13B"/>
-<stop offset="1" stop-color="#41B883"/>
-</linearGradient>
-<clipPath id="clip0_1962_4638">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/pixel-perfection-subelement-do.svg

@@ -1,67 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1955_26980)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M20 210C19.9992 194.603 24.4413 179.533 32.7935 166.598C41.1456 153.664 53.0527 143.414 67.086 137.08C81.1193 130.745 96.6824 128.595 111.908 130.886C127.133 133.178 141.373 139.815 152.92 150" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M100 130C127.614 130 150 107.614 150 80C150 52.3858 127.614 30 100 30C72.3858 30 50 52.3858 50 80C50 107.614 72.3858 130 100 130Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M200 180H220V200H200V220H180V200H160V180H180V160H200V180Z" fill="black"/>
-<g opacity="0.5">
-<path d="M150 200V180H160V200H150Z" fill="black"/>
-<path d="M180 150H200V160H180V150Z" fill="black"/>
-<path d="M230 180V200H220V180H230Z" fill="black"/>
-<path d="M200 230H180V220H200V230Z" fill="black"/>
-</g>
-<path opacity="0.5" d="M190 160V220M220 190H160" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M190 160V220M220 190H160" stroke="#41B883" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M180 220V200H160C154.477 200 150 195.523 150 190C150 184.477 154.477 180 160 180H180V160C180 154.477 184.477 150 190 150C195.523 150 200 154.477 200 160V180H220C225.523 180 230 184.477 230 190C230 195.523 225.523 200 220 200H200V220C200 225.523 195.523 230 190 230C184.477 230 180 225.523 180 220Z" stroke="#41B883" stroke-dasharray="1 1"/>
-<defs>
-<clipPath id="clip0_1955_26980">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/round-caps-violation.svg

@@ -1,70 +0,0 @@
-<svg width="241" height="240" viewBox="0 0 241 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_23313)">
-<path d="M0.5 10H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 20H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 30H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 40H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 50H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 60H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 70H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 80H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 90H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 100H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 110H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 120H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 130H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 140H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 150H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 160H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 170H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 180H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 190H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 200H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 210H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 220H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0.5 230H240.5" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230.5 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M20.5 120H45.4C49.7532 119.988 53.9835 118.555 57.4486 115.92C60.9138 113.285 63.4246 109.592 64.6 105.4L88.1 21.8C88.2515 21.2807 88.5673 20.8246 89 20.5C89.4327 20.1754 89.9591 20 90.5 20C91.0409 20 91.5673 20.1754 92 20.5C92.4327 20.8246 92.7485 21.2807 92.9 21.8L120.5 120" stroke="black" stroke-width="20" stroke-linecap="square" stroke-linejoin="round"/>
-<path d="M220.5 120H195.7C191.33 119.991 187.077 121.413 183.591 124.05C180.106 126.686 177.58 130.392 176.4 134.6L152.9 218.2C152.749 218.719 152.433 219.175 152 219.5C151.567 219.825 151.041 220 150.5 220C149.959 220 149.433 219.825 149 219.5C148.567 219.175 148.251 218.719 148.1 218.2L120.5 120" stroke="black" stroke-width="20" stroke-linejoin="round"/>
-<path d="M220.5 120H180.5M60.5 120H20.5" stroke="url(#paint0_linear_1940_23313)" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M10.5 110H30.5V130H10.5V110Z" fill="#DD0031"/>
-<path opacity="0.5" d="M210.5 110H220.5V130H210.5V110Z" fill="#DD0031"/>
-<circle opacity="0.5" cx="220.5" cy="120" r="20" stroke="#DD0031" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="20.5" cy="120" r="20" stroke="#DD0031" stroke-dasharray="1 1"/>
-<circle cx="220.5" cy="120" r="2" fill="#DD0031"/>
-<circle cx="20.5" cy="120" r="2" fill="#DD0031"/>
-<defs>
-<linearGradient id="paint0_linear_1940_23313" x1="20.5" y1="99.5008" x2="220.5" y2="99.501" gradientUnits="userSpaceOnUse">
-<stop stop-color="#DD0031"/>
-<stop offset="0.20238" stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.801339" stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="1" stop-color="#DD0031"/>
-</linearGradient>
-<clipPath id="clip0_1940_23313">
-<rect width="240" height="240" fill="white" transform="translate(0.5)"/>
-</clipPath>
-</defs>
-</svg>

docs/images/round-joints-violation.svg

@@ -1,73 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1940_23256)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M20 120H44.9C49.2532 119.988 53.4835 118.555 56.9486 115.92C60.4138 113.285 62.9246 109.592 64.1 105.4L90 40L120 120" stroke="black" stroke-width="20" stroke-linecap="round"/>
-<path d="M220 120H195.2C190.83 119.991 186.577 121.413 183.091 124.05C179.606 126.686 177.08 130.392 175.9 134.6L150 200L120 120" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="bevel"/>
-<path d="M105 75L90 40L75 75M135 165L150 200L165 165" stroke="url(#paint0_linear_1940_23256)" stroke-linecap="round" stroke-linejoin="round"/>
-<g opacity="0.5">
-<path d="M100 40C100 45.5228 95.5228 50 90 50C84.4772 50 80 45.5228 80 40C80 38.4354 80.3593 36.9546 81 35.6359C82.6207 32.2997 86.0418 30 90 30C94.102 30 97.6271 32.4698 99.1694 36.0034C99.2925 36.2854 99.4029 36.5741 99.5 36.8688C99.8245 37.8538 100 38.9064 100 40Z" fill="#DD0031"/>
-<path d="M81 35.6359C82.6207 32.2997 86.0418 30 90 30C94.102 30 97.6271 32.4698 99.1694 36.0034L90 12L81 35.6359Z" fill="#DD0031"/>
-</g>
-<circle opacity="0.5" cx="90" cy="40" r="20" stroke="#DD0031" stroke-dasharray="1 1"/>
-<circle opacity="0.5" cx="150" cy="200" r="20" stroke="#DD0031" stroke-dasharray="1 1"/>
-<circle cx="90" cy="40" r="2" fill="#DD0031"/>
-<circle cx="150" cy="200" r="2" fill="#DD0031"/>
-<path opacity="0.5" d="M140 200C140 194.477 144.477 190 150 190C155.523 190 160 194.477 160 200C160 201.296 159.753 202.535 159.304 203.672L140.641 203.5L140.5 203.131C140.176 202.146 140 201.094 140 200Z" fill="#DD0031"/>
-<defs>
-<linearGradient id="paint0_linear_1940_23256" x1="120" y1="40" x2="120" y2="220" gradientUnits="userSpaceOnUse">
-<stop stop-color="#DD0031"/>
-<stop offset="0.244047" stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="0.759672" stop-color="#DD0031" stop-opacity="0"/>
-<stop offset="1" stop-color="#DD0031"/>
-</linearGradient>
-<clipPath id="clip0_1940_23256">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/visual-weight-consistent.svg

@@ -1,12 +0,0 @@
-<svg width="196" height="88" viewBox="0 0 196 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M69 35H55C53.8954 35 53 35.8954 53 37V51C53 52.1046 53.8954 53 55 53H69C70.1046 53 71 52.1046 71 51V37C71 35.8954 70.1046 35 69 35Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M101 47L107 53" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M101 41L107 35" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M107 48V53H102" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M107 40V35H102" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M89 48V53H94" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M89 53L95 47" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M89 40V35H94" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M95 41L89 35" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M134 54C139.523 54 144 49.5228 144 44C144 38.4772 139.523 34 134 34C128.477 34 124 38.4772 124 44C124 49.5228 128.477 54 134 54Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

docs/images/visual-weight-uneven.svg

@@ -1,20 +0,0 @@
-<svg width="196" height="88" viewBox="0 0 196 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M47 47L54 54" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M47 41L54 34" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M54 48V54H48" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M54 40V34H48" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M34 48V54H40" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M34 54L41 47" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M34 40V34H40" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M41 41L34 34" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M87 35H73C71.8954 35 71 35.8954 71 37V51C71 52.1046 71.8954 53 73 53H87C88.1046 53 89 52.1046 89 51V37C89 35.8954 88.1046 35 87 35Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M116 54C121.523 54 126 49.5228 126 44C126 38.4772 121.523 34 116 34C110.477 34 106 38.4772 106 44C106 49.5228 110.477 54 116 54Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M154 46L160 52" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M154 42L160 36" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M160 47V52H155" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M160 41V36H155" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M144 47V52H149" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M144 52L150 46" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M144 41V36H149" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M150 42L144 36" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

docs/images/visually-centered-do.svg

@@ -1,57 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1936_19361)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M40.37 46.88C39.9753 45.9691 39.8636 44.9607 40.0494 43.9855C40.2351 43.0104 40.7098 42.1137 41.4117 41.4117C42.1137 40.7098 43.0104 40.2351 43.9855 40.0494C44.9607 39.8636 45.9691 39.9753 46.88 40.37L206.88 105.37C207.853 105.766 208.676 106.459 209.233 107.35C209.79 108.241 210.052 109.284 209.982 110.332C209.913 111.381 209.515 112.38 208.845 113.189C208.175 113.998 207.267 114.576 206.25 114.84L145.01 130.64C141.55 131.53 138.391 133.33 135.862 135.853C133.333 138.377 131.527 141.532 130.63 144.99L114.84 206.25C114.576 207.267 113.998 208.175 113.189 208.845C112.38 209.515 111.381 209.913 110.332 209.982C109.284 210.052 108.241 209.79 107.35 209.233C106.459 208.676 105.766 207.853 105.37 206.88L40.37 46.88Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M120 0V240M240 120H0" stroke="#F56565" stroke-dasharray="1 1"/>
-<defs>
-<clipPath id="clip0_1936_19361">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/visually-centered-dont.svg

@@ -1,57 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1936_19418)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M20.37 26.88C19.9753 25.9691 19.8636 24.9607 20.0494 23.9855C20.2351 23.0104 20.7098 22.1137 21.4117 21.4117C22.1137 20.7098 23.0104 20.2351 23.9855 20.0494C24.9607 19.8636 25.9691 19.9753 26.88 20.37L186.88 85.37C187.853 85.7663 188.676 86.4591 189.233 87.3498C189.79 88.2406 190.052 89.2841 189.982 90.3323C189.913 91.3805 189.515 92.3801 188.845 93.1893C188.175 93.9984 187.267 94.576 186.25 94.84L125.01 110.64C121.55 111.53 118.391 113.33 115.862 115.853C113.333 118.377 111.527 121.532 110.63 124.99L94.84 186.25C94.576 187.267 93.9984 188.175 93.1893 188.845C92.3801 189.515 91.3805 189.913 90.3323 189.982C89.2841 190.052 88.2406 189.79 87.3498 189.233C86.4591 188.676 85.7663 187.853 85.37 186.88L20.37 26.88Z" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M120 0V240M240 120H0" stroke="#F56565" stroke-dasharray="1 1"/>
-<defs>
-<clipPath id="clip0_1936_19418">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/visually-centered-symmetrical-do.svg

@@ -1,58 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1936_19498)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M180 60L60 180" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M60 60L180 180" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M120 0V240M240 120H0" stroke="#F56565" stroke-dasharray="1 1"/>
-<defs>
-<clipPath id="clip0_1936_19498">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/images/visually-centered-symmetrical-dont.svg

@@ -1,57 +0,0 @@
-<svg width="240" height="240" viewBox="0 0 240 240" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1936_19604)">
-<path d="M0 10H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M10 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 20H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M20 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 30H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M30 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 40H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M40 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 50H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M50 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 60H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M60 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 70H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M70 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 80H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M80 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 90H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M90 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 100H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M100 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 110H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M110 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 120H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M120 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 130H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M130 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 140H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M140 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 150H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M150 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 160H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M160 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 170H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M170 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 180H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M180 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 190H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M190 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 200H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M200 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 210H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M210 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 220H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M220 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M0 230H240" stroke="#D8D8D9" stroke-width="0.5"/>
-<path d="M230 0V240" stroke="#D8D8D9" stroke-width="0.5"/>
-</g>
-<path d="M210 90L90 210M90 90L210 210" stroke="black" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"/>
-<path opacity="0.5" d="M120 0V240M240 120H0" stroke="#F56565" stroke-dasharray="1 1"/>
-<defs>
-<clipPath id="clip0_1936_19604">
-<rect width="240" height="240" fill="white"/>
-</clipPath>
-</defs>
-</svg>

docs/package.json

@@ -68,6 +68,6 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "sandpack-vue3": "3.1.12",
-    "vue": "^3.5.42"
+    "vue": "^3.5.41"
   }
 }

docs/vercel.json

@@ -106,31 +106,6 @@
       "source": "/contributing",
       "destination": "/contribute",
       "permanent": true
-    },
-    {
-      "source": "/contribute/icon-design-guide",
-      "destination": "/contribute/icons/design-principles",
-      "permanent": true
-    },
-    {
-      "source": "/contribute/illustrator-guide",
-      "destination": "/contribute/icons/illustrator-guide",
-      "permanent": true
-    },
-    {
-      "source": "/contribute/inkscape-guide",
-      "destination": "/contribute/icons/inkscape-guide",
-      "permanent": true
-    },
-    {
-      "source": "/contribute/figma-guide",
-      "destination": "/contribute/icons/figma-guide",
-      "permanent": true
-    },
-    {
-      "source": "/contribute/affinity-designer-guide",
-      "destination": "/contribute/icons/affinity-designer-guide",
-      "permanent": true
     }
   ],
   "headers": [

icons/bridge.json

@@ -1,36 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "Nykoula",
-    "jamiemlaw"
-  ],
-  "use-cases": [
-    "Representing crossing infrastructure in navigation apps",
-    "Marking river crossings or connecting routes on maps",
-    "Showing clearance-limited transit zones in maritime dashboards"
-  ],
-  "tags": [
-    "overpass",
-    "cross over",
-    "traverse",
-    "viaduct",
-    "suspension",
-    "infrastructure",
-    "transportation",
-    "crossing",
-    "road",
-    "river",
-    "gate",
-    "golden",
-    "travel",
-    "landmark",
-    "route",
-    "maritime",
-    "clearance"
-  ],
-  "categories": [
-    "travel",
-    "transportation",
-    "buildings"
-  ]
-}

icons/can-soda.json

@@ -1,25 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "karsa-mistmere",
-    "jaynewey"
-  ],
-  "use-cases": [
-    "representing canned drinks like soda or beer",
-    "representing canned foods like soup or legumes",
-    "representing litter/waste"
-  ],
-  "tags": [
-    "beverage",
-    "drink",
-    "food",
-    "soda",
-    "tin",
-    "beer",
-    "alcohol",
-    "waste"
-  ],
-  "categories": [
-    "food-beverage"
-  ]
-}

icons/can-soda.svg

@@ -1,18 +0,0 @@
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="24"
-  height="24"
-  viewBox="0 0 24 24"
-  fill="none"
-  stroke="currentColor"
-  stroke-width="2"
-  stroke-linecap="round"
-  stroke-linejoin="round"
->
-  <path d="m17 22 1.664-2.496a2 2 0 00.336-1.11V5.606a2 2 0 00-.336-1.11L17 2" />
-  <path d="M18 22H6" />
-  <path d="M18 2H6" />
-  <path d="M5 17h14" />
-  <path d="M5 7h14" />
-  <path d="m7 22-1.664-2.496A2 2 0 015 18.394V5.606a2 2 0 01.336-1.11L7 2" />
-</svg>

icons/can.json

@@ -1,28 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "l0uisgrange",
-    "karsa-mistmere"
-  ],
-  "use-cases": [
-    "Representing canned food in grocery or delivery apps",
-    "Labelling pantry items or nonperishable inventory",
-    "Indicating metal recycling or recyclable containers",
-    "Denoting canned ingredients in recipe or meal-planning interfaces"
-  ],
-  "tags": [
-    "food",
-    "storage",
-    "groceries",
-    "tin",
-    "metal",
-    "recyclable",
-    "container",
-    "pantry",
-    "grocery",
-    "preserved"
-  ],
-  "categories": [
-    "food-beverage"
-  ]
-}

icons/can.svg

@@ -1,16 +0,0 @@
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="24"
-  height="24"
-  viewBox="0 0 24 24"
-  fill="none"
-  stroke="currentColor"
-  stroke-width="2"
-  stroke-linecap="round"
-  stroke-linejoin="round"
->
-  <path d="M21 10.5a9 2.5 0 01-18 0v8a9 2.5 0 0018 0z" />
-  <path d="M21 10.5A9 2.5 25.32 004.59 3.47 9 2.5 25.32 0021 10.5" />
-  <path d="M3 10.5a9 2.5 0 016.527-2.405" />
-  <path d="M9 16.858a31 31 0 006 0" />
-</svg>

icons/credit-card-reader.json

@@ -1,38 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "jguddas",
-    "karsa-mistmere"
-  ],
-  "use-cases": [
-    "Processing card payments at checkout terminals",
-    "Locating ATMs or payment kiosks on maps",
-    "Indicating card-present transactions in finance apps",
-    "Showing contactless or chip card payment options"
-  ],
-  "tags": [
-    "bank",
-    "purchase",
-    "payment",
-    "cc",
-    "atm",
-    "terminal",
-    "checkout",
-    "kiosk",
-    "pos",
-    "point of sale",
-    "transaction",
-    "contactless",
-    "chip",
-    "swipe",
-    "tap",
-    "banking",
-    "finance",
-    "retail"
-  ],
-  "categories": [
-    "finance",
-    "navigation",
-    "shopping"
-  ]
-}

icons/credit-card-reader.svg

@@ -1,16 +0,0 @@
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="24"
-  height="24"
-  viewBox="0 0 24 24"
-  fill="none"
-  stroke="currentColor"
-  stroke-width="2"
-  stroke-linecap="round"
-  stroke-linejoin="round"
->
-  <path d="M15 16v1" />
-  <path d="M16.963 7.734A1 1 0 0015.999 7H8.003a1 1 0 00-.964.734L4.073 18.467A2 2 0 006 21h12a2 2 0 001.927-2.532z" />
-  <path d="M2.678 8.5A2 2 0 012 7V5a2 2 0 012-2h16a2 2 0 012 2v2a2 2 0 01-.676 1.499" />
-  <path d="m9 21 2-14" />
-</svg>

icons/door-closed-locked.svg

@@ -9,9 +9,9 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M19 8V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16" />
-  <path d="M2 21h8" />
-  <path d="M20 16v-2a2 2 0 00-4 0v2" />
-  <path d="M9 12h.01" />
-  <rect x="14" y="16" width="8" height="5" rx="1" />
+  <path d="M10 12h.01" />
+  <path d="M18 9V6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14" />
+  <path d="M2 20h8" />
+  <path d="M20 17v-2a2 2 0 1 0-4 0v2" />
+  <rect x="14" y="17" width="8" height="5" rx="1" />
 </svg>

icons/door-closed.svg

@@ -9,7 +9,7 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16" />
-  <path d="M2 21h20" />
-  <path d="M9 12h.01" />
+  <path d="M10 12h.01" />
+  <path d="M18 20V6a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v14" />
+  <path d="M2 20h20" />
 </svg>

icons/door-open.svg

@@ -9,9 +9,9 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M10 21H2" />
-  <path d="M10 4a2 2 0 012.36-1.968l5.41.992A1.5 1.5 0 0119 4.5V21l-7.876.992A1 1 0 0110 21z" />
-  <path d="M10.268 3H7a2 2 0 00-2 2v16" />
+  <path d="M11 20H2" />
+  <path d="M11 4.562v16.157a1 1 0 0 0 1.242.97L19 20V5.562a2 2 0 0 0-1.515-1.94l-4-1A2 2 0 0 0 11 4.561z" />
+  <path d="M11 4H8a2 2 0 0 0-2 2v14" />
   <path d="M14 12h.01" />
-  <path d="M22 21h-3" />
+  <path d="M22 20h-3" />
 </svg>

icons/door-stairwell.json

@@ -1,40 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "jguddas",
-    "karsa-mistmere"
-  ],
-  "use-cases": [
-    "Indicating stair access in building navigation",
-    "Showing floor levels in building directories",
-    "Marking where an item is located by floor",
-    "Directing users to take stairs instead of elevators"
-  ],
-  "tags": [
-    "staircase",
-    "stairway",
-    "stairs",
-    "steps",
-    "ladder",
-    "transition",
-    "access",
-    "structure",
-    "espiral",
-    "building",
-    "vertical",
-    "movement",
-    "floor",
-    "level",
-    "entrance",
-    "entry",
-    "exit",
-    "egress",
-    "route",
-    "indoor",
-    "emergency exit"
-  ],
-  "categories": [
-    "home",
-    "travel"
-  ]
-}

icons/door-stairwell.svg

@@ -1,17 +0,0 @@
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  width="24"
-  height="24"
-  viewBox="0 0 24 24"
-  fill="none"
-  stroke="currentColor"
-  stroke-width="2"
-  stroke-linecap="round"
-  stroke-linejoin="round"
->
-  <path d="M12 17v-3a1 1 0 011-1h6" />
-  <path d="M19 17h-9a1 1 0 00-1 1v3" />
-  <path d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16" />
-  <path d="M19 9h-3a1 1 0 00-1 1v3" />
-  <path d="M22 21H2" />
-</svg>