Simplified Palette
++
- new_icon:
- - com.example/com.example.MainActivity
- ```
+## Colors
- 2.2. The new icon with multiple ComponentInfos:
- > Can be used for linking ComponentInfos with the existing icon
- ```yaml
- # lines omitted for example
+### Rules
- new_icon:
- - com.example/com.example.MainActivity
- - com.example/com.example.StartActivity
- ```
+- Use $\textcolor{#56595B}{\textsf{⬤}}$ #56595B Davy's grey as default black.
- 2.3. The new icon with a custom category:
- > For example, if your icon named as `pixel_buds` but you want it to go in `Google` category.
-
- > Note that you don't need to specify `New` category, it will be automatically copied to it, and you don't need to specify category if this is a named icon, _e.g._ `N` category is redundant for `new_icon`, the script will place it to `N` category automatically based on the first letter of drawable name.
-
- ```yaml
- new_icon:
- category: 'Google'
- compinfos:
- - com.example/com.example.MainActivity
- - com.example/com.example.StartActivity
- ```
+- Use $\textcolor{#FF837D}{\textsf{⬤}}$ #FF837D Coral pink as default red and $\textcolor{#BA6561}{\textsf{⬤}}$ #BA6561 Fuzzy Wuzzy as default dark red. Shades of red are specifically for shading purposes and complex arrangements (if we're honest it's mostly complex anime / game icons overusing pink).
- 2.4. The icon without the ComponentInfo (the alternative icon):
+- Transparencies can be used as an overlay for additional shading. Please keep the use of them to a minimum. Try to get by with basic colors and greys as much as possible. If you do use transparency, it should be an overlay, never a background (the overall shape of the icon should not contain any semi-transparent areas).
- ```yaml
- # lines omitted for example
+- Gradients are more acceptable than transparencies, but the usage should still be kept to a sensible minimum (as noted above).
- new_icon_alt_1: {}
- ```
+### Palette
-And we're done! Repeat the process for adding new icons.
+| Greys | +Basic | +Reds | +Skintones | +
|---|---|---|---|
|
+ $\textcolor{#FFFFFF}{\textsf{⬤}}$ $\textcolor{#ECECEC}{\textsf{⬤}}$ $\textcolor{#D8D8D8}{\textsf{⬤}}$ $\textcolor{#D2D2D2}{\textsf{⬤}}$ $\textcolor{#CCCCCC}{\textsf{⬤}}$ $\textcolor{#B1B5BD}{\textsf{⬤}}$ $\textcolor{#A0A5AF}{\textsf{⬤}}$ $\textcolor{#979797}{\textsf{⬤}}$ $\textcolor{#83868C}{\textsf{⬤}}$ $\textcolor{#56595B}{\textsf{⬤}}$ $\textcolor{#4A4A4A}{\textsf{⬤}}$ $\textcolor{#000000}{\textsf{⬤}}$ |
+
+ $\textcolor{#FFD6D4}{\textsf{⬤}}$ $\textcolor{#FF837D}{\textsf{⬤}}$ $\textcolor{#BA6561}{\textsf{⬤}}$ $\textcolor{#D3B69A}{\textsf{⬤}}$ $\textcolor{#8E6F60}{\textsf{⬤}}$ $\textcolor{#FCECDC}{\textsf{⬤}}$ $\textcolor{#F8C18C}{\textsf{⬤}}$ $\textcolor{#FDF5D9}{\textsf{⬤}}$ $\textcolor{#F9DE81}{\textsf{⬤}}$ $\textcolor{#C39A54}{\textsf{⬤}}$ $\textcolor{#E0F4E0}{\textsf{⬤}}$ $\textcolor{#98DC9A}{\textsf{⬤}}$ $\textcolor{#71A372}{\textsf{⬤}}$ $\textcolor{#96DFD3}{\textsf{⬤}}$ $\textcolor{#73ADA4}{\textsf{⬤}}$ $\textcolor{#9ABEFF}{\textsf{⬤}}$ $\textcolor{#728DBE}{\textsf{⬤}}$ $\textcolor{#54688C}{\textsf{⬤}}$ $\textcolor{#ABABFF}{\textsf{⬤}}$ $\textcolor{#BD9AFF}{\textsf{⬤}}$ $\textcolor{#8C72BD}{\textsf{⬤}}$ |
+
+ $\textcolor{#FFB0AC}{\textsf{⬤}}$ $\textcolor{#F58F8A}{\textsf{⬤}}$ $\textcolor{#F4806D}{\textsf{⬤}}$ $\textcolor{#E85E5C}{\textsf{⬤}}$ $\textcolor{#DC505E}{\textsf{⬤}}$ $\textcolor{#B02A3C}{\textsf{⬤}}$ $\textcolor{#7A1B1C}{\textsf{⬤}}$ $\textcolor{#511119}{\textsf{⬤}}$ |
+
+ $\textcolor{#F1E9E0}{\textsf{⬤}}$ $\textcolor{#D6C8BA}{\textsf{⬤}}$ $\textcolor{#D4C6B8}{\textsf{⬤}}$ $\textcolor{#D7D0B8}{\textsf{⬤}}$ $\textcolor{#E2C9B0}{\textsf{⬤}}$ $\textcolor{#D4B79A}{\textsf{⬤}}$ $\textcolor{#BF9E73}{\textsf{⬤}}$ |
+
+delta_icon_delivery. The component info would be dictated by the app itself and be akin to something like com.delta.delivery/com.delta.delivery.Actvities.MainActivity.
+|
|
-|---|---|
+- `category` — overrides the automatic category assignment, e.g. if you want to assign a Google app icon to the Google category. If not set, the category is assigned based on the following logic:
-Or you can check [Figma icon template](https://www.figma.com/design/02aiFRSLkikcw8mpBAnoDA/Delta-Icon-Template?m=auto&t=qyLH05AMDzZwAI2s-1).
+ - if the drawable name starts with `_[0-9]` (e.g. `_2048`), the category will be `#`
+ - if the drawable name ends with `_alt_[0-9]+` (e.g. `telegram_alt_23`), the category will be `Alts`
+ - else the category will be `A–Z` based on the first letter of the drawable name
-## Colors
+- `compinfo` — a list of ComponentInfos to link to the current icon. It can be a string or a list (see more in [Examples](#examples)).
-### Rules
+#### Examples
+```yaml
+# a new icon with a single ComponentInfo
+# without adding icon images it will only link a ComponentInfo with new_icon
+new_icon: com.example/com.example.MainActivity
+# or with multiple ComponentInfos
+new_icon:
+ - com.example/com.example.MainActivity
+ - com.example/com.example.SplashActivity
-- [ $\textcolor{#56595B}{\textsf{⬤}}$ #56595B Davy's grey ] as default Black
+# new alternative icons
+# will be automatically assigned to Alts category
+new_icon_alt_1: com.example/com.example.MainActivity
+new_icon_alt_2: com.example/com.example.SplashActivity
+# or new standalone alternative icons
+new_icon_alt_1: {}
+new_icon_alt_2: {}
+# if you're not sure if there's no alts with these names, you can use this:
+# _alt_x#FF837D Coral pink ] as default Red and [ $\textcolor{#BA6561}{\textsf{⬤}}$ #BA6561 Fuzzy Wuzzy ] as default Dark Red. Shades of Red are specifically for shading purposes
+# a new standalone icon
+new_icon: {}
-- Transparencies — White (25%, 50%, 70%) and Black (15%, 25%) can be used as overlay for additional shading
+# add a new Google app icon to Google category
+google_app:
+ category: google
-### Palette
+# rewrite the icons of an existing icons without touching XMLs
+# existing_icons.png and existing_icon.svg must be in contribs/icons
+existing_icon:
+ rebrand: rewrite
-> Palette variants are hidden under spoilers below
+# rebrand an existing icon and make the previous icon a standalone alternative icon \
+# as existing_icon_alt_x (x will be automatically calculated)
+existing_icon:
+ rebrand: rebrand
-
-| Greys | -Basic | -Reds | -Skintones | -
|---|---|---|---|
|
- $\textcolor{#FFFFFF}{\textsf{⬤}}$ $\textcolor{#ECECEC}{\textsf{⬤}}$ $\textcolor{#D8D8D8}{\textsf{⬤}}$ $\textcolor{#D2D2D2}{\textsf{⬤}}$ $\textcolor{#CCCCCC}{\textsf{⬤}}$ $\textcolor{#B1B5BD}{\textsf{⬤}}$ $\textcolor{#A0A5AF}{\textsf{⬤}}$ $\textcolor{#979797}{\textsf{⬤}}$ $\textcolor{#83868C}{\textsf{⬤}}$ $\textcolor{#56595B}{\textsf{⬤}}$ $\textcolor{#4A4A4A}{\textsf{⬤}}$ $\textcolor{#000000}{\textsf{⬤}}$ |
-
- $\textcolor{#FFD6D4}{\textsf{⬤}}$ $\textcolor{#FF837D}{\textsf{⬤}}$ $\textcolor{#BA6561}{\textsf{⬤}}$ $\textcolor{#D3B69A}{\textsf{⬤}}$ $\textcolor{#8E6F60}{\textsf{⬤}}$ $\textcolor{#FCECDC}{\textsf{⬤}}$ $\textcolor{#F8C18C}{\textsf{⬤}}$ $\textcolor{#FDF5D9}{\textsf{⬤}}$ $\textcolor{#F9DE81}{\textsf{⬤}}$ $\textcolor{#C39A54}{\textsf{⬤}}$ $\textcolor{#E0F4E0}{\textsf{⬤}}$ $\textcolor{#98DC9A}{\textsf{⬤}}$ $\textcolor{#71A372}{\textsf{⬤}}$ $\textcolor{#96DFD3}{\textsf{⬤}}$ $\textcolor{#73ADA4}{\textsf{⬤}}$ $\textcolor{#9ABEFF}{\textsf{⬤}}$ $\textcolor{#728DBE}{\textsf{⬤}}$ $\textcolor{#54688C}{\textsf{⬤}}$ $\textcolor{#ABABFF}{\textsf{⬤}}$ $\textcolor{#BD9AFF}{\textsf{⬤}}$ $\textcolor{#8C72BD}{\textsf{⬤}}$ |
-
- $\textcolor{#FFB0AC}{\textsf{⬤}}$ $\textcolor{#F58F8A}{\textsf{⬤}}$ $\textcolor{#F4806D}{\textsf{⬤}}$ $\textcolor{#E85E5C}{\textsf{⬤}}$ $\textcolor{#DC505E}{\textsf{⬤}}$ $\textcolor{#B02A3C}{\textsf{⬤}}$ $\textcolor{#7A1B1C}{\textsf{⬤}}$ $\textcolor{#511119}{\textsf{⬤}}$ |
-
- $\textcolor{#F1E9E0}{\textsf{⬤}}$ $\textcolor{#D6C8BA}{\textsf{⬤}}$ $\textcolor{#D4C6B8}{\textsf{⬤}}$ $\textcolor{#D7D0B8}{\textsf{⬤}}$ $\textcolor{#E2C9B0}{\textsf{⬤}}$ $\textcolor{#D4B79A}{\textsf{⬤}}$ $\textcolor{#BF9E73}{\textsf{⬤}}$ |
-