Res Module
The module included colors.xml and dimens.xml resource.
colors.xml
base
NOTE: white has the same usage as black, such as:’black_alpha_16’->’white_alpha_16’
| color preview | res id | value |
|---|---|---|
| trans | #00000000 | |
| black_alpha_16 | #10000000 | |
| black_alpha_32 | #20000000 | |
| black_alpha_48 | #30000000 | |
| black_alpha_64 | #40000000 | |
| black_alpha_80 | #50000000 | |
| black_alpha_96 | #60000000 | |
| black_alpha_112 | #70000000 | |
| black_alpha_128 | #80000000 | |
| black_alpha_144 | #90000000 | |
| black_alpha_160 | #a0000000 | |
| black_alpha_176 | #b0000000 | |
| black_alpha_192 | #c0000000 | |
| black_alpha_208 | #d0000000 | |
| black_alpha_224 | #e0000000 | |
| black_alpha_240 | #f0000000 | |
| black | #000000 | |
| white | #ffffff |
red
| color preview | res id | value |
|---|---|---|
| red_50 | #fde0dc | |
| red_100 | #f9bdbb | |
| red_200 | #f69988 | |
| red_300 | #f36c60 | |
| red_400 | #e84e40 | |
| red_500 | #e51c23 | |
| red_600 | #dd191d | |
| red_700 | #d01716 | |
| red_800 | #c41411 | |
| red_900 | #b0120a | |
| red_a100 | #ff7997 | |
| red_a200 | #ff5177 | |
| red_a400 | #ff2d6f | |
| red_a700 | #e00032 |
pink
| color preview | res id | value |
|---|---|---|
| pink_50 | #fce4ec | |
| pink_100 | #f8bbd0 | |
| pink_200 | #f48fb1 | |
| pink_300 | #f06292 | |
| pink_400 | #ec407a | |
| pink_500 | #e91e63 | |
| pink_600 | #d81b60 | |
| pink_700 | #c2185b | |
| pink_800 | #ad1457 | |
| pink_900 | #880e4f | |
| pink_a100 | #ff80ab | |
| pink_a200 | #ff4081 | |
| pink_a400 | #f50057 | |
| pink_a700 | #c51162 |
purple
| color preview | res id | value |
|---|---|---|
| purple_50 | #f3e5f5 | |
| purple_100 | #e1bee7 | |
| purple_200 | #ce93d8 | |
| purple_300 | #ba68c8 | |
| purple_400 | #ab47bc | |
| purple_500 | #9c27b0 | |
| purple_600 | #8e24aa | |
| purple_700 | #7b1fa2 | |
| purple_800 | #6a1b9a | |
| purple_900 | #4a148c | |
| purple_a100 | #ea80fc | |
| purple_a200 | #e040fb | |
| purple_a400 | #d500f9 | |
| purple_a700 | #aa00ff |
deep_purple
| color preview | res id | value |
|---|---|---|
| deep_purple_50 | #ede7f6 | |
| deep_purple_100 | #d1c4e9 | |
| deep_purple_200 | #b39ddb | |
| deep_purple_300 | #9575cd | |
| deep_purple_400 | #7e57c2 | |
| deep_purple_500 | #673ab7 | |
| deep_purple_600 | #5e35b1 | |
| deep_purple_700 | #512da8 | |
| deep_purple_800 | #4527a0 | |
| deep_purple_900 | #311b92 | |
| deep_purple_a100 | #b388ff | |
| deep_purple_a200 | #7c4dff | |
| deep_purple_a400 | #651fff | |
| deep_purple_a700 | #6200ea |
indigo
| color preview | res id | value |
|---|---|---|
| indigo_50 | #e8eaf6 | |
| indigo_100 | #c5cae9 | |
| indigo_200 | #9fa8da | |
| indigo_300 | #7986cb | |
| indigo_400 | #5c6bc0 | |
| indigo_500 | #3f51b5 | |
| indigo_600 | #3949ab | |
| indigo_700 | #303f9f | |
| indigo_800 | #283593 | |
| indigo_900 | #1a237e | |
| indigo_a100 | #8c9eff | |
| indigo_a200 | #536dfe | |
| indigo_a400 | #3d5afe | |
| indigo_a700 | #304ffe |
blue
| color preview | res id | value |
|---|---|---|
| blue_50 | #e7e9fd | |
| blue_100 | #d0d9ff | |
| blue_200 | #afbfff | |
| blue_300 | #91a7ff | |
| blue_400 | #738ffe | |
| blue_500 | #5677fc | |
| blue_600 | #4e6cef | |
| blue_700 | #455ede | |
| blue_800 | #3b50ce | |
| blue_900 | #2a36b1 | |
| blue_a100 | #a6baff | |
| blue_a200 | #6889ff | |
| blue_a400 | #4d73ff | |
| blue_a700 | #4d69ff |
light_blue
| color preview | res id | value |
|---|---|---|
| light_blue_50 | #e1f5fe | |
| light_blue_100 | #b3e5fc | |
| light_blue_200 | #81d4fa | |
| light_blue_300 | #4fc3f7 | |
| light_blue_400 | #29b6f6 | |
| light_blue_500 | #03a9f4 | |
| light_blue_600 | #039be5 | |
| light_blue_700 | #0288d1 | |
| light_blue_800 | #0277bd | |
| light_blue_900 | #01579b | |
| light_blue_a100 | #80d8ff | |
| light_blue_a200 | #40c4ff | |
| light_blue_a400 | #00b0ff | |
| light_blue_a700 | #0091ea |
cyan
| color preview | res id | value |
|---|---|---|
| cyan_50 | #e0f7fa | |
| cyan_100 | #b2ebf2 | |
| cyan_200 | #80deea | |
| cyan_300 | #4dd0e1 | |
| cyan_400 | #26c6da | |
| cyan_500 | #00bcd4 | |
| cyan_600 | #00acc1 | |
| cyan_700 | #0097a7 | |
| cyan_800 | #00838f | |
| cyan_900 | #006064 | |
| cyan_a100 | #84ffff | |
| cyan_a200 | #18ffff | |
| cyan_a400 | #00e5ff | |
| cyan_a700 | #00b8d4 |
teal
| color preview | res id | value |
|---|---|---|
| teal_50 | #e0f2f1 | |
| teal_100 | #b2dfdb | |
| teal_200 | #80cbc4 | |
| teal_300 | #4db6ac | |
| teal_400 | #26a69a | |
| teal_500 | #009688 | |
| teal_600 | #00897b | |
| teal_700 | #00796b | |
| teal_800 | #00695c | |
| teal_900 | #004d40 | |
| teal_a100 | #a7ffeb | |
| teal_a200 | #64ffda | |
| teal_a400 | #1de9b6 | |
| teal_a700 | #00bfa5 |
green
| color preview | res id | value |
|---|---|---|
| green_50 | #d0f8ce | |
| green_100 | #a3e9a4 | |
| green_200 | #72d572 | |
| green_300 | #42bd41 | |
| green_400 | #2baf2b | |
| green_500 | #259b24 | |
| green_600 | #0a8f08 | |
| green_700 | #0a7e07 | |
| green_800 | #056f00 | |
| green_900 | #0d5302 | |
| green_a100 | #a2f78d | |
| green_a200 | #5af158 | |
| green_a400 | #14e715 | |
| green_a700 | #12c700 |
light_green
| color preview | res id | value |
|---|---|---|
| light_green_50 | #f1f8e9 | |
| light_green_100 | #dcedc8 | |
| light_green_200 | #c5e1a5 | |
| light_green_300 | #aed581 | |
| light_green_400 | #9ccc65 | |
| light_green_500 | #8bc34a | |
| light_green_600 | #7cb342 | |
| light_green_700 | #689f38 | |
| light_green_800 | #558b2f | |
| light_green_900 | #33691e | |
| light_green_a100 | #ccff90 | |
| light_green_a200 | #b2ff59 | |
| light_green_a400 | #76ff03 | |
| light_green_a700 | #64dd17 |
lime
| color preview | res id | value |
|---|---|---|
| lime_50 | #f9fbe7 | |
| lime_100 | #f0f4c3 | |
| lime_200 | #e6ee9c | |
| lime_300 | #dce775 | |
| lime_400 | #d4e157 | |
| lime_500 | #cddc39 | |
| lime_600 | #c0ca33 | |
| lime_700 | #afb42b | |
| lime_800 | #9e9d24 | |
| lime_900 | #827717 | |
| lime_a100 | #f4ff81 | |
| lime_a200 | #eeff41 | |
| lime_a400 | #c6ff00 | |
| lime_a700 | #aeea00 |
yellow
| color preview | res id | value |
|---|---|---|
| yellow_50 | #fffde7 | |
| yellow_100 | #fff9c4 | |
| yellow_200 | #fff59d | |
| yellow_300 | #fff176 | |
| yellow_400 | #ffee58 | |
| yellow_500 | #ffeb3b | |
| yellow_600 | #fdd835 | |
| yellow_700 | #fbc02d | |
| yellow_800 | #f9a825 | |
| yellow_900 | #f57f17 | |
| yellow_a100 | #ffff8d | |
| yellow_a200 | #ffff00 | |
| yellow_a400 | #ffea00 | |
| yellow_a700 | #ffd600 |
amber
| color preview | res id | value |
|---|---|---|
| amber_50 | #fff8e1 | |
| amber_100 | #ffecb3 | |
| amber_200 | #ffe082 | |
| amber_300 | #ffd54f | |
| amber_400 | #ffca28 | |
| amber_500 | #ffc107 | |
| amber_600 | #ffb300 | |
| amber_700 | #ffa000 | |
| amber_800 | #ff8f00 | |
| amber_900 | #ff6f00 | |
| amber_a100 | #ffe57f | |
| amber_a200 | #ffd740 | |
| amber_a400 | #ffc400 | |
| amber_a700 | #ffab00 |
orange
| color preview | res id | value |
|---|---|---|
| orange_50 | #fff3e0 | |
| orange_100 | #ffe0b2 | |
| orange_200 | #ffcc80 | |
| orange_300 | #ffb74d | |
| orange_400 | #ffa726 | |
| orange_500 | #ff9800 | |
| orange_600 | #fb8c00 | |
| orange_700 | #f57c00 | |
| orange_800 | #ef6c00 | |
| orange_900 | #e65100 | |
| orange_a100 | #ffd180 | |
| orange_a200 | #ffab40 | |
| orange_a400 | #ff9100 | |
| orange_a700 | #ff6d00 |
deep_orange
| color preview | res id | value |
|---|---|---|
| deep_orange_50 | #fbe9e7 | |
| deep_orange_100 | #ffccbc | |
| deep_orange_200 | #ffab91 | |
| deep_orange_300 | #ff8a65 | |
| deep_orange_400 | #ff7043 | |
| deep_orange_500 | #ff5722 | |
| deep_orange_600 | #f4511e | |
| deep_orange_700 | #e64a19 | |
| deep_orange_800 | #d84315 | |
| deep_orange_900 | #bf360c | |
| deep_orange_a100 | #ff9e80 | |
| deep_orange_a200 | #ff6e40 | |
| deep_orange_a400 | #ff3d00 | |
| deep_orange_a700 | #dd2c00 |
brown
| color preview | res id | value |
|---|---|---|
| brown_50 | #efebe9 | |
| brown_100 | #d7ccc8 | |
| brown_200 | #bcaaa4 | |
| brown_300 | #a1887f | |
| brown_400 | #8d6e63 | |
| brown_500 | #795548 | |
| brown_600 | #6d4c41 | |
| brown_700 | #5d4037 | |
| brown_800 | #4e342e | |
| brown_900 | #3e2723 |
grey
| color preview | res id | value |
|---|---|---|
| grey_50 | #fafafa | |
| grey_100 | #f5f5f5 | |
| grey_200 | #eeeeee | |
| grey_300 | #e0e0e0 | |
| grey_400 | #bdbdbd | |
| grey_500 | #9e9e9e | |
| grey_600 | #757575 | |
| grey_700 | #616161 | |
| grey_800 | #424242 | |
| grey_900 | #3e2723 |
blue_grey
| color preview | res id | value |
|---|---|---|
| blue_grey_50 | #eceff1 | |
| blue_grey_100 | #cfd8dc | |
| blue_grey_200 | #b0bec5 | |
| blue_grey_300 | #90a4ae | |
| blue_grey_400 | #78909c | |
| blue_grey_500 | #607d8b | |
| blue_grey_600 | #546e7a | |
| blue_grey_700 | #455a64 | |
| blue_grey_800 | #37474f | |
| blue_grey_900 | #263238 |
dimens.xml
The include font_*/len_* values. font unit:sp, other:dp.
You can use such as:
- android:textSize=”@dimen/font_12”
- android:padding=”@dimen/len_12”
font
font_4, font_6, font_8, font_10, font_12, font_14, font_16, font_18, font_20, font_22, font_24, font_28, font_32, font_34, font_38, font_44, font_56, font_112
len
len_2, len_4, len_6, len_8, len_10, len_12, len_14, len_16, len_20, len_24, len_28, len_32, len_36, len_40, len_44, len_52, len_56, len_60, len_64, len_68, len_72, len_76, len_80, len_84, len_88, len_92, len_96, len_100, len_116, len_128, len_156, len_172, len_224, len_256